API tools faq
paste
Advertisement
skynotte

ntp-aqua

skynotte
Jul 25th, 2013
772
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.46 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html lang="en">
  2. <!----
  3. AQUA PAGE THEME MADE BY NOTTE-THEMES.TUMBLR.COM <- DO NOT REMOVE!
  4. PLEASE DO NOT REMOVE CREDIT BUTTON!
  5.  
  6. Be proud of who made your theme, keep the credit!
  7.  
  8. Follow my rules in my terms of use, enjoy the theme and be sure to report any errors you may find directly to the theme creator. You have plenty of customization options so please look at them before you attempt to alter anything.
  9.  
  10. Background used is from SubtlePatterns.com
  11.  
  12. For easy access color codes here are some URLS:
  13. http://colorschemedesigner.com
  14.  
  15. Use this to match with an image color scheme:
  16. http://www.pictaculous.com
  17.  
  18. QUICK HTML LESSONS:
  19. TO BOLD SOMETHING
  20. <strong> BOLD TEXT HERE </strong>
  21. TO ITALICIZE SOMETHING
  22. <i> ITALIC TEXT HERE </i>
  23. TO LINK SOMETHING
  24. <a href="URL HERE"> TEXT HERE </a>
  25. TO SIGNIFY A PARAGRAPH
  26. <p> TEXT IN PARAGRAPH HERE </p>
  27. TO START ON A NEW A LINE IN A PARAGRAPH
  28. <p> SOME TEXT HERE <br />
  29. SOME MORE TEXT HERE </p>
  30.  
  31. -->
  32. <head>
  33.  
  34. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  35. <link href="http://static.tumblr.com/eih4pta/Flam72cb8/animate-custom__1_.css" rel="stylesheet">
  36.  
  37. <title>{Title}</title>
  38. <link rel="shortcut icon" href="{Favicon}" />
  39. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  40.  
  41. <style type="text/css">
  42.  
  43. /* -------------- SCROLLBAR --------------- */
  44.  
  45. ::-webkit-scrollbar {
  46. width: 5px;
  47. height:5px;
  48. background: transparent;
  49. }
  50.  
  51. ::-webkit-scrollbar-thumb {
  52. background-color: #2580a2; /*scrollbar color*/
  53. }
  54.  
  55. /* -------------- CONTENT --------------- */
  56.  
  57. body{
  58. color:#524a48; /*text color */
  59. font-family: Calibri, sans-serif;
  60. font-size: 12px;
  61. line-height:120%;
  62. overflow-x:hidden;
  63. word-wrap: break-word;
  64. text-decoration: none;
  65. background-color: #FFFFFF; /*main background color*/
  66.  
  67. /* image background code - if you want a image for your background remove the / * and * / around the code below */
  68.  
  69.  
  70. background-image: url('http://static.tumblr.com/7657c6655415d0ef7f33cd5b0081ca8f/ko5czgu/g7ymqin93/tumblr_static_snow.png');
  71. background-attachment: fixed;
  72.  
  73.  
  74. /* If you want the background to stretch to fit the screen then remove the / * and * / around the code below */
  75.  
  76. /*
  77. background-size:100% 100%;
  78. */
  79. }
  80.  
  81. a {
  82. text-decoration:none;
  83. color:#706866; /*default link color */
  84. }
  85.  
  86. #containme{width:95%; margin-top:140px;}
  87.  
  88. #wrap{
  89. width: 1000px;
  90. float:center;
  91. position: relative;
  92. }
  93.  
  94. .section{
  95. float:left;
  96. display:inline-block;
  97. display:-moz-inline-stack;
  98. vertical-align:top;
  99. margin-right:40px;
  100. margin-bottom:40px;
  101. }
  102.  
  103. /* -------------- LINKS --------------- */
  104.  
  105. #linkers{
  106. position:fixed;
  107. width:100%;
  108. height:auto;
  109. top:0px;
  110. left:0px;
  111. z-index:2;
  112. font-family: Gill Sans, sans-serif;
  113. text-transform:uppercase;
  114. background-color: #000000; /* links background color */
  115. border-bottom:10px solid #2580a2; /*links background border */
  116. }
  117.  
  118. #linkers ul{list-style:none; padding:0px; margin:0px;}
  119.  
  120. #linkers li{float:left;}
  121.  
  122. .hl{
  123. color:#cccccc; /* links text color */
  124. line-height:35px;
  125. padding:10px 20px 10px 20px;
  126. display:block;
  127. font-size:13px;
  128. text-align:center;
  129. }
  130.  
  131. .hl:hover, #linkers li:hover .hl{
  132. background-color: #2580a2; /* links background color hover */
  133. color:#FFFFFF; /* links text color hover */
  134. }
  135.  
  136.  
  137. /* -------------- DESCRIPTION --------------- */
  138.  
  139. .description{
  140. position:absolute;
  141. width:40%;
  142. max-height:230px;
  143. overflow:auto;
  144. display:none;
  145. padding:10px;
  146. text-align:left;
  147. text-transform:none;
  148. z-index:2;
  149. color:#FFFFFF; /* description text color */
  150. background-color: #000000; /* description background color */
  151. }
  152.  
  153. #linkers li:hover .description{display:block;}
  154.  
  155.  
  156. /* -------------- TAG BOX CATEGORY --------------- */
  157.  
  158. #tagsbox{
  159. width:200px;
  160. height:auto;
  161. overflow:hidden;
  162. position:relative;
  163. background-color: #000000; /* tags box fill/border color */
  164. padding:5px;
  165. margin: 0px;
  166. list-style: none;
  167. margin-bottom:10px;
  168. }
  169.  
  170. #tagsbox img{width:200px; height:200px; display:block;}
  171.  
  172.  
  173. /* -------------- TAG BOX CATEGORY TITLE --------------- */
  174.  
  175. .tagsboxtitle{
  176. position:absolute;
  177. z-index:1;
  178. line-height:200px;
  179. overflow:auto;
  180. width:200px;
  181. color: #000000; /* tags category title color */
  182. background-color: #FFFFFF; /* tags category title background */
  183. opacity:0.2;
  184. display:block;
  185. -webkit-transition: all 0.4s ease-in-out;
  186. -moz-transition: all 0.4s ease-in-out;
  187. -o-transition: all 0.4s ease-in-out;
  188. transition: all 0.4s ease-in-out;
  189. }
  190.  
  191. #tagsbox:hover .tagsboxtitle, .tagsboxtitle:hover{opacity:0.8;}
  192.  
  193. /* -------------- INDIVIDUAL TAGS --------------- */
  194.  
  195. .tags{
  196. width:200px;
  197. line-height:120%;
  198. background-color:#9BD0E0; /* tags background color */
  199. height:auto;
  200. padding:5px;
  201. }
  202.  
  203. .tags a{
  204. color: #FFFFFF; /* individual tags color */
  205. display:block;
  206. width:190px;
  207. text-align:center;
  208. font-size:11px;
  209. line-height:120%;
  210. overflow:hidden;
  211. letter-spacing:1px;
  212. padding:5px;
  213. }
  214.  
  215. .tags a:hover{
  216. background-color: #FFFFFF; /* tags background color oh hover */
  217. color: #000000; /* individual tags color on hover */
  218. }
  219.  
  220. </style>
  221.  
  222. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  223.  
  224. <script>
  225. $(window).load(function () {
  226. var $container = $('#wrap');
  227.   $container.masonry({
  228.  
  229.    itemSelector: '.section'
  230.   }).imagesLoaded(function() {
  231.   $container.masonry('reload');
  232.   });
  233.  
  234. });
  235. </script>
  236.  
  237.  
  238. </head>
  239. <body>
  240.  
  241. <center>
  242.  
  243.  
  244. <!---------- START LINKS ----------------------><div id="linkers"><ul>
  245.  
  246. <li><a href="/" class="hl">return</a></li>
  247. <li><a href="#" class="hl">about this page</a>
  248.  
  249. <!---------- START DESCRIPTION -----------><ul><li class="description">
  250.  
  251. <p>Fusce a metus eu diam varius
  252. <strong>congue nec nec sapien.</strong>
  253. Vestibulum orci tortor, sollicitudin ac euismod non, placerat ac augue. Nunc convallis accumsan justo. Pellentesque habitant morbi tristique senectus et netus et malesuada
  254. <a href="http://notte-themes.tumblr.com">fames ac turpis egestas.</a>
  255. Donec malesuada vehicula lectus, viverra sodales ipsum gravida nec. Integer gravida nisi ut magna mollis molestie. Nullam pharetra accumsan sagittis. Proin tristique rhoncus orci, eget vulputate nisi sollicitudin et. Quisque lacus augue, mollis non mollis et, ullamcorper in purus. Morbi et sem orci. Praesent accumsan odio in ante ullamcorper id pellentesque mauris rhoncus. Duis vitae neque dolor. Duis sed purus at eros bibendum cursus nec a nulla.<br /> <i>Donec turpis quam, ultricies id pretium sit amet, gravida eget leo.</i></p>
  256.  
  257. <!-- Replace the text with what you want, you can use both paragraphs or just one or even add another. If you don't have a description to introduce your tags feel free to delete this -->
  258.  
  259. <p>Proin ut quam eros. Donec sed lobortis diam. Nulla nec odio lacus. Quisque porttitor egestas dolor in placerat. Nunc vehicula dapibus ipsum. Duis venenatis risus non nunc fermentum dapibus. Morbi lorem ante, malesuada in mollis nec, auctor nec massa. Aenean tempus dui eget felis blandit at fringilla urna ultrices. Suspendisse feugiat, ante et viverra lacinia, lectus sem lobortis dui, ultricies consectetur leo mauris at tortor. Nunc et tortor sit amet orci consequat semper. Nulla non fringilla diam. </p>
  260.  
  261. </li></ul><!---------- END DESCRIPTION ---------------------->
  262.  
  263. <li><a href="/" class="hl">link</a>
  264. <li><a href="/" class="hl">link</a>
  265. <li><a href="/" class="hl">link</a>
  266. <li><a href="http://tumblr.com/dashboard" class="hl">Dashboard</a></li>
  267.  
  268.  
  269. <!---------- DO NOT REMOVE THIS NEXT LINK ------------------>
  270. <li><a href="http://notte-themes.tumblr.com" class="hl">credit</a></li>
  271. <!---------- DO NOT REMOVE THE ABOVE LINK ------------------>
  272.  
  273.  
  274. </ul></div><!---------- END LINKS ---------------------->
  275.  
  276.  
  277.  
  278.  
  279.  
  280. <div id="containme">
  281. <div id="wrap">
  282.  
  283.  
  284.  
  285.  
  286.  
  287. <!-- START TAGS BOX - duplicate for another box -->
  288. <div class="section">
  289. <div id="tagsbox">
  290.  
  291.  
  292. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  293.  
  294. CATEGORY TITLE
  295.  
  296. </span><!-------- END TAGS BOX TITLE ---------->
  297.  
  298.  
  299.  
  300.  
  301. <!-------- START TAGS BOX IMAGE -------->
  302.  
  303. <img src="http://static.tumblr.com/885e1abc8053711fca102b082fc316fd/wk1x3im/ku9mqimrc/tumblr_static_1187197210-13327.jpg" />
  304.  
  305. <!-------- END TAGS BOX IMAGE -------->
  306.  
  307.  
  308. </div>
  309.  
  310. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  311.  
  312.  
  313. <a href="/">tag</a>
  314. <a href="/">tag</a>
  315. <a href="/">tag</a>
  316. <a href="/">tag</a>
  317. <a href="/">tag</a>
  318. <a href="/">tag</a>
  319.  
  320.  
  321. </div><!-------- END TAGS BOX LINKS ---------------------->
  322.  
  323.  
  324. </div><!---------- END TAGS BOX ---------------------->
  325.  
  326.  
  327.  
  328.  
  329.  
  330.  
  331.  
  332. <!-- START TAGS BOX - duplicate for another box -->
  333. <div class="section">
  334. <div id="tagsbox">
  335.  
  336.  
  337. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  338.  
  339. CATEGORY TITLE
  340.  
  341. </span><!-------- END TAGS BOX TITLE ---------->
  342.  
  343.  
  344.  
  345.  
  346. <!-------- START TAGS BOX IMAGE -------->
  347.  
  348. <img src="http://static.tumblr.com/ace05603f4bbcf9069302b17a99925dc/wk1x3im/Zfbmqf2z5/tumblr_static_1187197210-13394.jpg" />
  349.  
  350. <!-------- END TAGS BOX IMAGE -------->
  351.  
  352.  
  353. </div>
  354.  
  355. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  356.  
  357.  
  358. <a href="/">tag</a>
  359. <a href="/">tag</a>
  360. <a href="/">tag</a>
  361. <a href="/">tag</a>
  362.  
  363.  
  364. </div><!-------- END TAGS BOX LINKS ---------------------->
  365.  
  366.  
  367. </div><!---------- END TAGS BOX ---------------------->
  368.  
  369.  
  370.  
  371.  
  372.  
  373.  
  374.  
  375. <!-- START TAGS BOX - duplicate for another box -->
  376. <div class="section">
  377. <div id="tagsbox">
  378.  
  379.  
  380. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  381.  
  382. CATEGORY TITLE
  383.  
  384. </span><!-------- END TAGS BOX TITLE ---------->
  385.  
  386.  
  387.  
  388.  
  389. <!-------- START TAGS BOX IMAGE -------->
  390.  
  391. <img src="http://static.tumblr.com/a032a412452b54887baaa094bcde1a14/wk1x3im/k03mqil27/tumblr_static_1187197210-13318.jpg" />
  392.  
  393. <!-------- END TAGS BOX IMAGE -------->
  394.  
  395.  
  396. </div>
  397.  
  398. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  399.  
  400.  
  401. <a href="/">tag</a>
  402. <a href="/">tag</a>
  403. <a href="/">tag</a>
  404. <a href="/">tag</a>
  405. <a href="/">tag</a>
  406.  
  407.  
  408. </div><!-------- END TAGS BOX LINKS ---------------------->
  409.  
  410.  
  411. </div><!---------- END TAGS BOX ---------------------->
  412.  
  413.  
  414.  
  415.  
  416.  
  417.  
  418. <!-- START TAGS BOX - duplicate for another box -->
  419. <div class="section">
  420. <div id="tagsbox">
  421.  
  422.  
  423. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  424.  
  425. CATEGORY TITLE
  426.  
  427. </span><!-------- END TAGS BOX TITLE ---------->
  428.  
  429.  
  430.  
  431.  
  432. <!-------- START TAGS BOX IMAGE -------->
  433.  
  434. <img src="http://static.tumblr.com/e1a8fc07ab461a37b45c2ea3080c55c9/wk1x3im/iEnmqimgl/tumblr_static_1187197210-13369.jpg" />
  435.  
  436. <!-------- END TAGS BOX IMAGE -------->
  437.  
  438.  
  439. </div>
  440.  
  441. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  442.  
  443.  
  444. <a href="/">tag</a>
  445. <a href="/">tag</a>
  446. <a href="/">tag</a>
  447. <a href="/">tag</a>
  448. <a href="/">tag</a>
  449.  
  450.  
  451. </div><!-------- END TAGS BOX LINKS ---------------------->
  452.  
  453.  
  454. </div><!---------- END TAGS BOX ---------------------->
  455.  
  456.  
  457.  
  458.  
  459.  
  460.  
  461. <!-- START TAGS BOX - duplicate for another box -->
  462. <div class="section">
  463. <div id="tagsbox">
  464.  
  465.  
  466. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  467.  
  468. CATEGORY TITLE
  469.  
  470. </span><!-------- END TAGS BOX TITLE ---------->
  471.  
  472.  
  473.  
  474.  
  475. <!-------- START TAGS BOX IMAGE -------->
  476.  
  477. <img src="http://static.tumblr.com/f1a2478b7a074a27587d3fb1932edd15/wk1x3im/hdWmqimiw/tumblr_static_1187197210-13386.jpg" />
  478.  
  479. <!-------- END TAGS BOX IMAGE -------->
  480.  
  481.  
  482. </div>
  483.  
  484. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  485.  
  486.  
  487. <a href="/">tag</a>
  488. <a href="/">tag</a>
  489. <a href="/">tag</a>
  490. <a href="/">tag</a>
  491. <a href="/">tag</a>
  492.  
  493.  
  494. </div><!-------- END TAGS BOX LINKS ---------------------->
  495.  
  496.  
  497. </div><!---------- END TAGS BOX ---------------------->
  498.  
  499.  
  500.  
  501.  
  502.  
  503.  
  504.  
  505. <!-- START TAGS BOX - duplicate for another box -->
  506. <div class="section">
  507. <div id="tagsbox">
  508.  
  509.  
  510. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  511.  
  512. CATEGORY TITLE
  513.  
  514. </span><!-------- END TAGS BOX TITLE ---------->
  515.  
  516.  
  517.  
  518.  
  519. <!-------- START TAGS BOX IMAGE -------->
  520.  
  521. <img src="http://static.tumblr.com/f7147b6c5aaf4fc4f1e6c5d88b0d3c4c/wk1x3im/YZzmqimmd/tumblr_static_1187197210-13352.jpg" />
  522.  
  523. <!-------- END TAGS BOX IMAGE -------->
  524.  
  525.  
  526. </div>
  527.  
  528. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  529.  
  530.  
  531. <a href="/">tag</a>
  532. <a href="/">tag</a>
  533. <a href="/">tag</a>
  534. <a href="/">tag</a>
  535. <a href="/">tag</a>
  536.  
  537.  
  538. </div><!-------- END TAGS BOX LINKS ---------------------->
  539.  
  540.  
  541. </div><!---------- END TAGS BOX ---------------------->
  542.  
  543.  
  544.  
  545.  
  546.  
  547.  
  548. <!-- START TAGS BOX - duplicate for another box -->
  549. <div class="section">
  550. <div id="tagsbox">
  551.  
  552.  
  553. <!-------- START TAGS BOX TITLE ------><span class="tagsboxtitle">
  554.  
  555. CATEGORY TITLE
  556.  
  557. </span><!-------- END TAGS BOX TITLE ---------->
  558.  
  559.  
  560.  
  561.  
  562. <!-------- START TAGS BOX IMAGE -------->
  563.  
  564. <img src="http://static.tumblr.com/4bb787b51a8e164309afbfd655307a88/wk1x3im/e0Jmqimnu/tumblr_static_1187197210-13353.jpg" />
  565.  
  566. <!-------- END TAGS BOX IMAGE -------->
  567.  
  568.  
  569. </div>
  570.  
  571. <!-------- START TAGS BOX LINKS -------------><div class="tags">
  572.  
  573.  
  574. <a href="/">tag</a>
  575. <a href="/">tag</a>
  576. <a href="/">tag</a>
  577. <a href="/">tag</a>
  578. <a href="/">tag</a>
  579. <a href="/">tag</a>
  580.  
  581.  
  582. </div><!-------- END TAGS BOX LINKS ---------------------->
  583.  
  584.  
  585. </div><!---------- END TAGS BOX ---------------------->
  586.  
  587.  
  588.  
  589.  
  590.  
  591.  
  592. </div><!-- wrap -->
  593. <div style="width:100%; height:30px"></div>
  594. </div><!-- containme -->
  595.  
  596. </center>
  597.  
  598. </body>
  599. </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!