Advertisement
kitamikeita

Tags Page 01b

Aug 30th, 2013
1,262
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.18 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.  
  6. <!-------------------------------------------------
  7. TAGS PAGE #01 || MADE BY: http://snootydormouse.tumblr.com (KITSTHEMES)
  8. ---------------------------------------------------
  9.  
  10. TERMS OF USAGE:
  11. - DO NOT REMOVE THE CREDIT
  12. - DO NOT REDISTRIBUTE
  13. - DO NOT CLAIM AS YOUR OWN
  14. - DO NOT USE AS A BASE
  15.  
  16. --------------------------------------------->
  17.  
  18. <title>Tags Page</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21.  
  22.  
  23. <style type="text/css">
  24.  
  25. body{
  26. font-family: trebuchet ms;
  27. margin:0px;
  28. padding:0px;
  29. font-size: 12px;
  30. line-height: 110%;
  31. background-color: #fff;
  32. color: #e3e3e3;
  33. overflow-x: hidden;
  34. }
  35.  
  36. body, html {
  37. height: 100%;
  38. }
  39.  
  40. a {
  41. text-decoration: none;
  42. text-align:center;
  43. text-transform:uppercase;
  44. font-size:10px;
  45. color:#ccc;
  46. }
  47.  
  48. @font-face {font-family: blackjack; src:url("http://digilander.libero.it/kitamikeita/Fonts/black_jack-webfont.ttf")}
  49.  
  50. .container {
  51. margin:10px auto 0 auto;
  52. width: 900px;
  53. height: 700px;
  54. background-color: transparent;
  55. }
  56.  
  57. .lines {
  58. height: 100%;
  59. width: 6px;
  60. margin-top: 0px;
  61. background-color: transparent;
  62. float: left
  63. }
  64.  
  65. .line1 {
  66. margin-left: 0;
  67. width: 6px;
  68. height: 33%;
  69. float: left;
  70. background-color: #c0addb;
  71. display:block
  72. }
  73.  
  74. .line2 {
  75. width: 6px;
  76. height: 34%;
  77. float: left;
  78. background-color: #ff8456;
  79. display:block
  80. }
  81.  
  82. .line3 {
  83. width: 6px;
  84. height: 33%;
  85. float: left;
  86. background-color: #d6ec5a;
  87. display:block
  88. }
  89.  
  90. .header {
  91. margin: 0 auto 0 auto;
  92. width: 500px;
  93. height: 35px;
  94. background-color: transparent;
  95. }
  96.  
  97. .hleft {
  98. padding: 2px 0 2px 0;
  99. width: 120px;
  100. height: 11px;
  101. font-family: trebuchet ms;
  102. color: #d9d9d9;
  103. text-align: center;
  104. vertical-align: middle;
  105. font-size: 9px;
  106. border-top: 1px solid #e8e8e8;
  107. border-bottom: 1px solid #e8e8e8;
  108. letter-spacing: 4px;
  109. text-transform: uppercase;
  110. margin-top: 37px;
  111. margin-left: 120px;
  112. float: left;
  113. }
  114.  
  115. .hright a {
  116. padding: 2px 0 2px 0;
  117. width: 100px;
  118. height: 11px;
  119. font-family: trebuchet ms;
  120. color: #d9d9d9;
  121. text-align: center;
  122. vertical-align: middle;
  123. font-size: 9px;
  124. border-top: 1px solid #e8e8e8;
  125. border-bottom: 1px solid #e8e8e8;
  126. letter-spacing: 4px;
  127. text-transform: uppercase;
  128. margin-top: 38px;
  129. margin-left: 4px;
  130. float: left;
  131. }
  132.  
  133. .headerimg {
  134. height: 30px;
  135. width: 30px;
  136. outline: solid 1px #e8e8e8;
  137. outline-offset: 3px;
  138. margin-left: 4px;
  139. margin-top: 30px;
  140. float: left
  141. }
  142.  
  143. .block01 {
  144. margin-left: 180px;
  145. margin-top: 100px;
  146. width: 185px;
  147. position: absolute;
  148. float:left;
  149. }
  150.  
  151. .block01 a {
  152. width: 170px;
  153. display: block;
  154. margin: 0;
  155. border-bottom: 1px solid #f2f2f2;
  156. padding: 5px;
  157. background-color: #fafafa;
  158. text-align: center;
  159. vertical-align: middle;
  160. overflow: hidden;
  161. font-size: 10px;
  162. transition: .4s;
  163. -o-transition-transition: .4s;
  164. -webkit-transition-duration: .4s;
  165. -moz-transition-duration: .4s;
  166. }
  167.  
  168. .block01 a:hover {
  169. color: #f8f8f8;
  170. display: block;
  171. background-color: #c0addb;
  172. border-bottom: solid 2px #ac9bc4;
  173. letter-spacing: 4px;
  174. font-size: 12px;
  175. transition: .4s;
  176. -o-transition-transition: .4s;
  177. -webkit-transition-duration: .4s;
  178. -moz-transition-duration: .4s;
  179. }
  180.  
  181. .block01title {
  182. font-family: blackjack;
  183. width: 130px;
  184. font-size: 28px;
  185. border-bottom: 2px dashed #8c8299;
  186. padding-bottom: 4px;
  187. color: #ac9bc4;
  188. background-color: transparent;
  189. text-align: center;
  190. position: absolute;
  191. margin-left: 202px;
  192. margin-top: 73px;
  193. transform:rotate(1deg);
  194. -ms-transform:rotate(1deg);
  195. -webkit-transform:rotate(1deg);
  196. }
  197.  
  198. .block01bottom {
  199. margin-left: 16px;
  200. margin-top: 4px;
  201. width: 150px;
  202. background: transparent;
  203. border-bottom: 2px dashed #8c8299;
  204. }
  205.  
  206. .tags01 {
  207. max-height: 311px;
  208. overflow-y: scroll;
  209. }
  210.  
  211. .block02 {
  212. margin-left: 370px;
  213. margin-top: 124px;
  214. width: 185px;
  215. position: absolute;
  216. float:left;
  217. }
  218.  
  219.  
  220. .block02 a {
  221. width: 170px;
  222. display: block;
  223. margin: 0;
  224. border-bottom: 1px solid #f2f2f2;
  225. padding: 5px;
  226. background-color: #fafafa;
  227. text-align: center;
  228. vertical-align: middle;
  229. overflow: hidden;
  230. transition: .4s;
  231. -o-transition-transition: .4s;
  232. -webkit-transition-duration: .4s;
  233. -moz-transition-duration: .4s;
  234. }
  235.  
  236. .block02 a:hover {
  237. color: #f8f8f8;
  238. display: block;
  239. background-color: #ff8456;
  240. border-bottom: solid 2px #e5764d;
  241. letter-spacing: 4px;
  242. font-size: 12px;
  243. transition: .4s;
  244. -o-transition-transition: .4s;
  245. -webkit-transition-duration: .4s;
  246. -moz-transition-duration: .4s;
  247. }
  248.  
  249. .block02title {
  250. font-family: blackjack;
  251. width: 130px;
  252. font-size: 28px;
  253. border-bottom: 2px dashed #b26c52;
  254. padding-bottom: 4px;
  255. color: #e5764d;
  256. background-color: transparent;
  257. text-align: center;
  258. position: absolute;
  259. margin-left: 392px;
  260. margin-top: 96px;
  261. transform:rotate(1deg);
  262. -ms-transform:rotate(1deg);
  263. -webkit-transform:rotate(1deg);
  264. }
  265.  
  266. .block02bottom {
  267. margin-left: 16px;
  268. margin-top: 4px;
  269. width: 150px;
  270. background: transparent;
  271. border-bottom: 2px dashed #b26c52;
  272. }
  273.  
  274. .tags02 {
  275. max-height: 311px;
  276. overflow-y: scroll;
  277. }
  278.  
  279. .block03 {
  280. margin-left: 560px;
  281. margin-top: 100px;
  282. width: 185px;
  283. position: absolute;
  284. float:left;
  285. }
  286.  
  287. .block03 a {
  288. width: 170px;
  289. display: block;
  290. margin: 0;
  291. border-bottom: 1px solid #f2f2f2;
  292. padding: 5px;
  293. background-color: #fafafa;
  294. text-align: center;
  295. vertical-align: middle;
  296. overflow: hidden;
  297. transition: .4s;
  298. -o-transition-transition: .4s;
  299. -webkit-transition-duration: .4s;
  300. -moz-transition-duration: .4s;
  301. }
  302.  
  303. .block03 a:hover {
  304. color: #f8f8f8;
  305. display: block;
  306. background-color: #d6ec5a;
  307. border-bottom: solid 2px #c0d350;
  308. letter-spacing: 4px;
  309. font-size: 12px;
  310. transition: .4s;
  311. -o-transition-transition: .4s;
  312. -webkit-transition-duration: .4s;
  313. -moz-transition-duration: .4s;
  314. }
  315.  
  316. .block03title {
  317. font-family: blackjack;
  318. width: 130px;
  319. font-size: 28px;
  320. border-bottom: 2px dashed #a5b259;
  321. padding-bottom: 4px;
  322. color: #c0d350;
  323. background-color: transparent;
  324. text-align: center;
  325. position: absolute;
  326. margin-left: 582px;
  327. margin-top: 73px;
  328. transform:rotate(1deg);
  329. -ms-transform:rotate(1deg);
  330. -webkit-transform:rotate(1deg);
  331. }
  332.  
  333. .block03bottom {
  334. margin-left: 16px;
  335. margin-top: 4px;
  336. width: 150px;
  337. background: transparent;
  338. border-bottom: 2px dashed #a5b259;
  339. }
  340.  
  341. .tags03 {
  342. max-height: 311px;
  343. overflow-y: scroll;
  344. }
  345.  
  346. .credits a {
  347. color: #aaa;
  348. font-family: arial;
  349. font-size: 13px;
  350. position:fixed;
  351. bottom:5px;
  352. right: 5px;
  353. }
  354.  
  355. ::-webkit-scrollbar {
  356. width:5px;
  357. height:auto;
  358. background: #e3e3e3;
  359. }
  360.  
  361. ::-webkit-scrollbar-corner {
  362. background: #e3e3e3;
  363. }
  364.  
  365. ::-webkit-scrollbar-thumb:vertical {
  366. background: #f0f0f0;
  367. }
  368.  
  369. ::-webkit-scrollbar-thumb:horizontal {
  370. background: #f0f0f0;
  371. }
  372.  
  373.  
  374. </style>
  375. </head>
  376. <body>
  377.  
  378. <div class="lines">
  379.  
  380. <div class="line1"></div>
  381. <div class="line2"></div>
  382. <div class="line3"></div>
  383.  
  384. </div>
  385.  
  386.  
  387.  
  388. <div class="header"><div class="hleft"><b>t</b>ags <b>p</b>age</div>
  389. <div class="headerimg"><a href="/"><img src="{PortraitURL-30}"></img></a></div>
  390. <div class="hright"><a href="/">home</a></div></div>
  391.  
  392.  
  393.  
  394.  
  395.  
  396. <div class="container">
  397.  
  398.  
  399. <br><br><br><br><br><br><br><br>
  400.  
  401. <div class="block01title">title 01</div>
  402. <div class="block01">
  403.  
  404. <div class="tags01">
  405.  
  406. <a href="URL LINK">LINK NAME</a>
  407. <a href="URL LINK">LINK NAME</a>
  408. <a href="URL LINK">LINK NAME</a>
  409. <a href="URL LINK">LINK NAME</a>
  410. <a href="URL LINK">LINK NAME</a>
  411. <a href="URL LINK">LINK NAME</a>
  412. <a href="URL LINK">LINK NAME</a>
  413. <a href="URL LINK">LINK NAME</a>
  414. <a href="URL LINK">LINK NAME</a>
  415. <a href="URL LINK">LINK NAME</a>
  416. <a href="URL LINK">LINK NAME</a>
  417. <a href="URL LINK">LINK NAME</a>
  418. <a href="URL LINK">LINK NAME</a>
  419. <a href="URL LINK">LINK NAME</a>
  420.  
  421. </div>
  422.  
  423. <div class="block01bottom"></div>
  424. </div>
  425.  
  426. <div class="block02title">title 02</div>
  427. <div class="block02">
  428.  
  429. <div class="tags02">
  430.  
  431. <a href="URL LINK">LINK NAME</a>
  432. <a href="URL LINK">LINK NAME</a>
  433. <a href="URL LINK">LINK NAME</a>
  434. <a href="URL LINK">LINK NAME</a>
  435. <a href="URL LINK">LINK NAME</a>
  436. <a href="URL LINK">LINK NAME</a>
  437. <a href="URL LINK">LINK NAME</a>
  438. <a href="URL LINK">LINK NAME</a>
  439. <a href="URL LINK">LINK NAME</a>
  440. <a href="URL LINK">LINK NAME</a>
  441. <a href="URL LINK">LINK NAME</a>
  442. <a href="URL LINK">LINK NAME</a>
  443. <a href="URL LINK">LINK NAME</a>
  444. <a href="URL LINK">LINK NAME</a>
  445.  
  446.  
  447. </div>
  448.  
  449. <div class="block02bottom"></div>
  450. </div>
  451.  
  452.  
  453. <div class="block03title">title 03</div>
  454. <div class="block03">
  455.  
  456. <div class="tags03">
  457.  
  458. <a href="URL LINK">LINK NAME</a>
  459. <a href="URL LINK">LINK NAME</a>
  460. <a href="URL LINK">LINK NAME</a>
  461. <a href="URL LINK">LINK NAME</a>
  462. <a href="URL LINK">LINK NAME</a>
  463. <a href="URL LINK">LINK NAME</a>
  464. <a href="URL LINK">LINK NAME</a>
  465. <a href="URL LINK">LINK NAME</a>
  466. <a href="URL LINK">LINK NAME</a>
  467. <a href="URL LINK">LINK NAME</a>
  468. <a href="URL LINK">LINK NAME</a>
  469. <a href="URL LINK">LINK NAME</a>
  470. <a href="URL LINK">LINK NAME</a>
  471. <a href="URL LINK">LINK NAME</a>
  472.  
  473. </div>
  474.  
  475. <div class="block03bottom"></div>
  476. </div>
  477.  
  478.  
  479.  
  480.  
  481.  
  482. </div>
  483.  
  484. <div class="credits"><a href="http://snootydormouse.tumblr.com">©</a></div>
  485. </body>
  486. </html>
  487.  
  488. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement