Advertisement
Guest User

blogroll

a guest
Dec 21st, 2014
183
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.61 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.  
  6.  
  7. <!-------------------------------------------------
  8. BLOGROLL #01 || MADE BY: http://snootydormouse.tumblr.com (KITSTHEMES)
  9. ---------------------------------------------------
  10.  
  11. TERMS OF USAGE:
  12. - DO NOT REMOVE THE CREDIT
  13. - DO NOT REDISTRIBUTE
  14. - DO NOT CLAIM AS YOUR OWN
  15. - DO NOT USE AS A BASE
  16.  
  17. --------------------------------------------->
  18.  
  19. <title>BLOGROLL</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22.  
  23. <link href="http://static.tumblr.com/la4ujvn/zhjmw840z/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  24.  
  25. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  26. <script src="http://static.tumblr.com/la4ujvn/xedmw81vj/jquery.style-my-tooltips.js"></script>
  27.  
  28. <script>
  29. (function($){
  30. $(document).ready(function(){
  31. $("[title]").style_my_tooltips({
  32. tip_follows_cursor:true,
  33. tip_delay_time:100});
  34. });
  35. })(jQuery);
  36. </script>
  37.  
  38.  
  39. <style type="text/css">
  40.  
  41. body {
  42. background:#fcfcfc;
  43. color: #333;
  44. font-family: trebuchet ms, Arial, sans-serif;
  45. font-size: 13px;
  46. }
  47.  
  48. a {
  49. color: #aaa;
  50. text-decoration: none;
  51. }
  52.  
  53. @font-face {font-family: infy; src:url("http://digilander.libero.it/kitamikeita/Fonts/Infinity.ttf")}
  54.  
  55. .container {width: 610px;
  56. margin: 60px auto}
  57.  
  58. .header {
  59. position: relative;
  60. width: 610px;
  61. height: 45px;
  62. margin: 10px auto 0 auto;
  63. font-family: infy, arial, trebuchet ms;
  64. font-size: 45px;
  65. color: #969696;
  66. text-transform: uppercase;
  67. letter-spacing: 10px;
  68. text-align: center;
  69. padding: 8px 0;
  70. background-color: #e3e3e3;
  71. }
  72.  
  73. .square {
  74. position: relative;
  75. width: 610px;
  76. height: 605px;
  77. margin: 0 auto;
  78. overflow-y: scroll;
  79. overflow-X: hidden;
  80. border-bottom: 3px double #f0f0f0;
  81. }
  82.  
  83. .link01 a, .link02 a {
  84. float: left;
  85. position: relative;
  86. width: 40px;
  87. height: 10px;
  88. margin-right: 2px;
  89. line-height: 9px;
  90. font-size: 13px;
  91. color: #969696;
  92. text-transform: uppercase;
  93. letter-spacing: 2px;
  94. text-align: center;
  95. padding: 4px 0;
  96. background-color: #f0f0f0;
  97. transition: all .4s;
  98. -o-transition: all .4s;
  99. -webkit-transition: all .4s;
  100. -moz-transition: all .4s;
  101. }
  102.  
  103. .link01 a {
  104. url no-repeat center 2%;}
  105.  
  106.  
  107. .link01 a:hover, .link02 a:hover {background-position: center 100%;
  108. background-color: #f2f2f2;
  109. transition: all .4s;
  110. -o-transition: all .4s;
  111. -webkit-transition: all .4s;
  112. -moz-transition: all .4s;
  113. }
  114.  
  115. .blogavatar {z-index: 1;
  116. width: 64px;
  117. height: 64px;
  118. margin: 5px;
  119. float: left;
  120. border: 6px solid #fff;
  121. position: relative;
  122. text-align: center;
  123. -webkit-box-shadow: 1px 1px 0px #e6e6e6;
  124. -moz-box-shadow: 1px 1px 0px #e6e6e6;
  125. box-shadow: 1px 1px 0px #e6e6e6;
  126. cursor: default;
  127. background: #fff
  128. }
  129.  
  130.  
  131. .blogavatar:hover {
  132. border-color: #f2f7f7; /* CUSTOM COLOR #01 */
  133. transform:rotate(360deg);
  134. -ms-transform:rotate(360deg);
  135. -webkit-transform:rotate(360deg)
  136. }
  137.  
  138. .blogavatar:nth-child(even):hover {
  139. border-color: #f7f5f2; /* CUSTOM COLOR #02 */
  140. transform:rotate(-360deg);
  141. -ms-transform:rotate(-360deg);
  142. -webkit-transform:rotate(-360deg)
  143. }
  144.  
  145. .blogavatar img {opacity: .7;
  146. transition: all 1s;
  147. -o-transition: all 1s;
  148. -webkit-transition: all 1s;
  149. -moz-transition: all 1s;}
  150.  
  151. .blogavatar:hover img {opacity: 1;
  152. transition: all 1s;
  153. -o-transition: all 1s;
  154. -webkit-transition: all 1s;
  155. -moz-transition: all 1s;}
  156.  
  157. .credits a {text-decoration: none;
  158. color: #aaa;
  159. font-family: arial;
  160. font-size: 13px;
  161. position:fixed;
  162. bottom: 12px;
  163. right: 17px;
  164. }
  165.  
  166. ::selection {
  167. background-color:#ccc;
  168. color:#fff;
  169. }
  170.  
  171. ::-moz-selection {
  172. background-color:#ccc;
  173. color:#fff;
  174. }
  175.  
  176. ::-webkit-scrollbar {
  177. width:5px;
  178. height:auto;
  179. background:#ffffff;
  180. }
  181.  
  182. ::-webkit-scrollbar-corner {
  183. background:#ffffff;
  184. }
  185.  
  186. ::-webkit-scrollbar-thumb:vertical {
  187. background:#d4d4d4;
  188. }
  189.  
  190. ::-webkit-scrollbar-thumb:horizontal {
  191. background:#d4d4d4;
  192. }
  193.  
  194. </style>
  195.  
  196.  
  197. </head>
  198.  
  199. <body>
  200. <div class="container">
  201.  
  202. <div /div>
  203. <div class="square">
  204.  
  205. {block:Following}
  206. {block:Followed}
  207.  
  208. <div class="blogavatar">
  209. <a href="{FollowedURL}" title="{FollowedName}" target="_blank"><img src="{FollowedPortraitURL-64}"></a>
  210.  
  211. </div>
  212.  
  213. {/block:Followed}
  214. {/block:Following}
  215.  
  216. </div>
  217.  
  218. <div class="link01"><a href="/" title="home">home</a></div><div class="link02"><a href="http://tumblr.com/dashboard" title="dashboard">back</a></div>
  219.  
  220.  
  221. </div>
  222.  
  223.  
  224.  
  225. <div class="credits"><a href="http://snootydormouse.tumblr.com">©</a></div>
  226.  
  227. </body>
  228.  
  229. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement