Advertisement
skynotte

ntp-tutti

Jan 29th, 2014
1,145
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.61 KB | None | 0 0
  1. <!DOCTYPE html lang="en">
  2. <!----
  3. TUTTI 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. For easy access color codes here are some URLS:
  11. http://colorschemedesigner.com
  12.  
  13. Use this to match with an image color scheme:
  14. http://www.pictaculous.com
  15.  
  16. QUICK HTML LESSONS:
  17. TO BOLD SOMETHING
  18. <strong> BOLD TEXT HERE </strong>
  19. TO ITALICIZE SOMETHING
  20. <i> ITALIC TEXT HERE </i>
  21. TO LINK SOMETHING
  22. <a href="URL HERE"> TEXT HERE </a>
  23. TO SIGNIFY A PARAGRAPH
  24. <p> TEXT IN PARAGRAPH HERE </p>
  25. TO START ON A NEW A LINE IN A PARAGRAPH
  26. <p> SOME TEXT HERE <br />
  27. SOME MORE TEXT HERE </p>
  28.  
  29. -->
  30. <head>
  31.  
  32. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  33. <link href="http://static.tumblr.com/eih4pta/Flam72cb8/animate-custom__1_.css" rel="stylesheet">
  34.  
  35. <title>{Title}</title>
  36. <link rel="shortcut icon" href="{Favicon}" />
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38.  
  39. <style type="text/css">
  40.  
  41. /* -------------- SCROLLBAR --------------- */
  42.  
  43. ::-webkit-scrollbar {
  44. width: 15px;
  45. background: #df5366; /*scrollbar background color*/
  46. }
  47.  
  48. ::-webkit-scrollbar-thumb {
  49. background-color: #a33754; /*scrollbar color*/
  50. }
  51.  
  52. /* -------------- CONTENT --------------- */
  53.  
  54. body{
  55. color:#9a1a38; /*text color */
  56. font-family: Calibri, sans-serif;
  57. font-size: 12px;
  58. line-height:120%;
  59. overflow-x:hidden;
  60. word-wrap: break-word;
  61. text-decoration: none;
  62. background-color: #e4dadc; /*main background color*/
  63.  
  64. /* image background code - if you want a image for your background remove the / * and * / around the code below */
  65.  
  66. /*
  67. background-image: url('YOUR IMAGE LINK HERE');
  68. background-attachment: fixed;
  69. */
  70.  
  71. /* If you want the background to stretch to fit the screen then remove the / * and * / around the code below */
  72.  
  73. /*
  74. background-size:100% 100%;
  75. */
  76. }
  77.  
  78. a {
  79. text-decoration:none;
  80. color:#3d0d18; /*default link color */
  81. }
  82.  
  83. b,strong{
  84. color:#5f303b; /* bold text color */
  85. }
  86.  
  87. #containme{
  88. width:700px;
  89. padding:30px;
  90. height:400px;
  91. background-color:#ffffff; /* large box background color */
  92. }
  93.  
  94.  
  95. /* -------------- LINKS --------------- */
  96.  
  97. .links{
  98. font-family: Gill Sans, sans-serif;
  99. text-transform:uppercase;
  100. text-align:center;
  101. width:760px;
  102. background-color:#9a1a38; /*links background color */
  103.  
  104. }
  105.  
  106. .links a{
  107. display:inline-block;
  108. display:-moz-inline-stack;
  109. color:#fcfcfc; /*links text color */
  110. padding:15px;
  111. position:relative;
  112.  
  113. }
  114.  
  115. .links a:hover{
  116. background-color:#f76074; /*links background hover color */
  117. color:#9a1a38; /*links text hover color */
  118. }
  119.  
  120. /* -------------- THIN BAR BELOW LINKS --------------- */
  121.  
  122. #thinbar{
  123. height:20px;
  124. width:760px;
  125. background-color:#f76074; /* thin bar color */
  126. /* banner background image - remove if not wanted */
  127.  
  128. background-image: url('http://static.tumblr.com/afdfe8ea44fdc48db19ff12a356688fc/wk1x3im/dCsn0666b/tumblr_static_1132865094-66130.jpg');
  129. background-attachment: fixed;
  130. background-size:auto 760px; /*this stretches the image, if you don't want it to stretch simply remove this*/
  131.  
  132. /* end banner background image */
  133.  
  134. }
  135.  
  136. /* -------------- TITLE --------------- */
  137.  
  138. .title{
  139. width:700px;
  140. margin-top:7%;
  141. text-align:center;
  142. font-family: Calibri, sans-serif;
  143. letter-spacing:1px;
  144. font-size: 28px;
  145. line-height:120%;
  146. padding:20px 30px;
  147. background-color:#9a1a38; /* title background color */
  148. text-transform: uppercase;
  149. color: #fcfcfc; /* title color */
  150. }
  151.  
  152. /* -------------- SIDE IMAGE --------------- */
  153.  
  154. /* to activate image scroll down further for instructions */
  155. .yourimage{
  156. width:350px;
  157. height:240px;
  158. overflow:hidden;
  159. margin-bottom:20px;
  160. border:10px solid #f76074; /* border color of image */
  161. }
  162. /* it'll being with <!--- START SIDE IMAGE ----> */
  163.  
  164. /* -------------- DESCRIPTION --------------- */
  165.  
  166. .description{
  167. text-align:justify;
  168. padding:10px;
  169. background-color:#f76074; /* description background color */
  170. overflow:auto;
  171. height:100px;
  172. width:350px;
  173. overflow-x:hidden;
  174. }
  175.  
  176.  
  177. /* -------------- TAG BOX CATEGORY --------------- */
  178.  
  179. #tags{
  180. width:300px;
  181. padding-top:10px;
  182. padding-bottom:10px;
  183. background-color:#f76074; /* tags section background color */
  184. position:relative;
  185. float:right;
  186. }
  187.  
  188.  
  189. #tags .subtags{
  190. padding:10px;
  191. width:250px;
  192. margin:10px;
  193. background-color:#fcfcfc; /* tags box color */
  194. overflow:auto;
  195. overflow-x:hidden;
  196. /* tags background image - remove if not wanted */
  197.  
  198. background-image: url(' IMAGE URL HERE ');
  199.  
  200. /* end tags background image */
  201.  
  202. background-attachment: fixed;
  203.  
  204. }
  205.  
  206. /* -------------- TAG BOX CATEGORY TITLE --------------- */
  207.  
  208. #tags .subtags h2{
  209. color:#fcfcfc; /*tags sub title color*/
  210. font-size:12px;
  211. margin-top:-10px;
  212. margin-bottom:-15px;
  213. margin-left:-10px;
  214. width:250px;
  215. font-family: Gill Sans, sans-serif;
  216. text-transform:uppercase;
  217. text-align:center;
  218. letter-spacing:1px;
  219. padding:15px;
  220. font-weight: normal;
  221. background-color: #a33754; /*tags sub title background*/
  222.  
  223. }
  224.  
  225. /* -------------- INDIVIDUAL TAGS --------------- */
  226. .subtags ul{
  227. text-align:left;
  228. list-style-position: inside;
  229. padding-left:0px;
  230. }
  231. .subtags ul li{list-style: none;
  232. padding:10px;
  233. letter-spacing:1px;
  234. }
  235. .uniarrow { float: left; width: 1.2em; }
  236. .u1:before { content: "→"; font-size:9px; float:left;}
  237.  
  238.  
  239. .subtags li a{color:#706866;} /* individual color of tags */
  240.  
  241. .subtags li:hover{
  242. color:#fefefe; /* color of tags when you hover */
  243. letter-spacing:2px;
  244. }
  245.  
  246. .subtags li:hover{
  247. background-color:#5f303b; /*color of tags background when you hover*/
  248. }
  249.  
  250.  
  251. </style>
  252.  
  253.  
  254. </head>
  255. <body>
  256.  
  257. <center>
  258.  
  259.  
  260. <!---------- START TITLE ----------------------><div class="title">
  261.  
  262. Notte Theme's Tag Page
  263.  
  264. </div><!---------- END TITLE ---------------------->
  265.  
  266. <div id="containme">
  267.  
  268. <div style="float:left; width:350px;">
  269.  
  270. <!---------- START SIDE IMAGE ------------------->
  271.  
  272.  
  273.  
  274.  
  275. <img src ="http://static.tumblr.com/4d63388af80b07b645081f3374787e83/wk1x3im/Vz2n0664x/tumblr_static_1132865094-66129.jpg" class="yourimage">
  276.  
  277.  
  278.  
  279.  
  280.  
  281. <!---------- END SIDE IMAGE ---------------------->
  282.  
  283.  
  284.  
  285.  
  286.  
  287. <!---------- START DESCRIPTION --------------><div class="description">
  288.  
  289. <p>Fusce a metus eu diam varius
  290. <strong>congue nec nec sapien.</strong>
  291. Vestibulum orci tortor, sollicitudin ac euismod non, placerat ac augue. Nunc convallis accumsan justo. Pellentesque habitant morbi tristique senectus et netus et malesuada
  292. <a href="http://notte-themes.tumblr.com">fames ac turpis egestas.</a>
  293. 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>
  294.  
  295. <!-- 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 -->
  296.  
  297. <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>
  298.  
  299. </div><!---------- END DESCRIPTION ---------------------->
  300.  
  301.  
  302. </div><!-- float:left -->
  303.  
  304.  
  305.  
  306.  
  307.  
  308. <div style="overflow:auto; height:400px; overflow-x:hidden;">
  309.  
  310. <!---------- START TAGS -- -----><div id="tags">
  311.  
  312.  
  313.  
  314. <!-------- START TAGS CATEGORY BOX -- duplicate for another box ----->
  315.  
  316. <div class="subtags">
  317. <h2>CATEGORY</h2> <!--THIS IS THE CATEGORY TITLE -->
  318. <br /><ul>
  319. <a href="/"><li><span class="uniarrow u1"></span>
  320. this is a tag <!--THIS IS THE TAG YOU CHANGE -->
  321. </li></a>
  322. <a href="/"><li><span class="uniarrow u1"></span>
  323. THIS IS ANOTHER TAG <!--THIS IS THE TAG YOU CHANGE -->
  324. </li></a>
  325. <a href="/"><li><span class="uniarrow u1"></span>
  326. third tag right here <!--THIS IS THE TAG YOU CHANGE -->
  327. </li></a>
  328. <a href="/"><li><span class="uniarrow u1"></span>
  329. last tag <!--THIS IS THE TAG YOU CHANGE -->
  330. </li></a>
  331. </ul>
  332. </div>
  333.  
  334. <!-------- END TAGS CATEGORY BOX ---------------------->
  335.  
  336.  
  337. <!-------- START TAGS CATEGORY BOX -- duplicate for another box ----->
  338.  
  339. <div class="subtags">
  340. <h2>CATEGORY</h2> <!--THIS IS THE CATEGORY TITLE -->
  341. <br /><ul>
  342. <a href="/"><li><span class="uniarrow u1"></span>
  343. tag <!--THIS IS THE TAG YOU CHANGE -->
  344. </li></a>
  345. <a href="/"><li><span class="uniarrow u1"></span>
  346. tag <!--THIS IS THE TAG YOU CHANGE -->
  347. </li></a>
  348. <a href="/"><li><span class="uniarrow u1"></span>
  349. tag <!--THIS IS THE TAG YOU CHANGE -->
  350. </li></a>
  351. <a href="/"><li><span class="uniarrow u1"></span>
  352. tag <!--THIS IS THE TAG YOU CHANGE -->
  353. </li></a>
  354. <a href="/"><li><span class="uniarrow u1"></span>
  355. tag <!--THIS IS THE TAG YOU CHANGE -->
  356. </li></a>
  357. <a href="/"><li><span class="uniarrow u1"></span>
  358. tag <!--THIS IS THE TAG YOU CHANGE -->
  359. </li></a>
  360. <a href="/"><li><span class="uniarrow u1"></span>
  361. tag <!--THIS IS THE TAG YOU CHANGE -->
  362. </li></a>
  363.  
  364. </ul>
  365. </div>
  366.  
  367. <!-------- END TAGS CATEGORY BOX ---------------------->
  368.  
  369.  
  370. <!-------- START TAGS CATEGORY BOX -- duplicate for another box ----->
  371.  
  372. <div class="subtags">
  373. <h2>CATEGORY</h2> <!--THIS IS THE CATEGORY TITLE -->
  374. <br /><ul>
  375. <a href="/"><li><span class="uniarrow u1"></span>
  376. tag <!--THIS IS THE TAG YOU CHANGE -->
  377. </li></a>
  378. <a href="/"><li><span class="uniarrow u1"></span>
  379. tag <!--THIS IS THE TAG YOU CHANGE -->
  380. </li></a>
  381. <a href="/"><li><span class="uniarrow u1"></span>
  382. tag <!--THIS IS THE TAG YOU CHANGE -->
  383. </li></a>
  384. <a href="/"><li><span class="uniarrow u1"></span>
  385. tag <!--THIS IS THE TAG YOU CHANGE -->
  386. </li></a>
  387. <a href="/"><li><span class="uniarrow u1"></span>
  388. tag <!--THIS IS THE TAG YOU CHANGE -->
  389. </li></a>
  390.  
  391. </ul>
  392. </div>
  393.  
  394. <!-------- END TAGS CATEGORY BOX ---------------------->
  395.  
  396.  
  397.  
  398.  
  399. <!-------- START TAGS CATEGORY BOX -- duplicate for another box ----->
  400.  
  401. <div class="subtags">
  402. <h2>CATEGORY</h2> <!--THIS IS THE CATEGORY TITLE -->
  403. <br /><ul>
  404. <a href="/"><li><span class="uniarrow u1"></span>
  405. tag <!--THIS IS THE TAG YOU CHANGE -->
  406. </li></a>
  407. <a href="/"><li><span class="uniarrow u1"></span>
  408. tag <!--THIS IS THE TAG YOU CHANGE -->
  409. </li></a>
  410. <a href="/"><li><span class="uniarrow u1"></span>
  411. tag <!--THIS IS THE TAG YOU CHANGE -->
  412. </li></a>
  413. <a href="/"><li><span class="uniarrow u1"></span>
  414. tag <!--THIS IS THE TAG YOU CHANGE -->
  415. </li></a>
  416.  
  417. </ul>
  418. </div>
  419.  
  420. <!-------- END TAGS CATEGORY BOX ---------------------->
  421.  
  422. </div><!---------- END TAGS---------------------->
  423.  
  424. </div><!-- DIV TO MAKE TAGS HAVE OWN SCROLLBAR -->
  425.  
  426. </div><!-- containme -->
  427.  
  428.  
  429. <!---------- START LINKS ----------------------><div class="links">
  430.  
  431. <a href="/">Main Page</a>
  432. <a href="http://tumblr.com/dashboard">Dashboard</a>
  433. <a href="/">link</a>
  434. <a href="/">link</a>
  435. <a href="/">link</a>
  436. <a href="/">link</a>
  437. <a href="/">link</a>
  438. <a href="/">link</a>
  439.  
  440. <!---------- DO NOT REMOVE THIS NEXT LINK ------------------>
  441. <a href="http://notte-themes.tumblr.com">credit</a>
  442. <!---------- DO NOT REMOVE THE ABOVE LINK ------------------>
  443.  
  444.  
  445.  
  446. </div><!---------- END LINKS ---------------------->
  447.  
  448. <div id="thinbar"></div>
  449.  
  450. <div style="width:100%; height:50px"></div>
  451.  
  452. </center>
  453.  
  454. </body>
  455. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement