Advertisement
thepinkrebellion

blogroll theme by neon themes!

Dec 24th, 2012
397
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.98 KB | None | 0 0
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <HTML>
  3.  
  4. <!--
  5. theme by neon-themes, very first blogroll theme :) please dont steal.
  6. !-->
  7. <style>
  8.  
  9.  
  10. @font-face {
  11. font-family: 'Tom Daley';
  12. src: url('http://static.tumblr.com/gfiuv4c/AiFmfiupd/tomdaley.ttf') format('truetype');
  13. font-weight: normal;
  14. font-style: normal;
  15.  
  16. }
  17.  
  18.  
  19. @font-face {
  20. font-family: 'titlefont';
  21. src: url('http://static.tumblr.com/gfiuv4c/jJgmfiu93/accent.ttf') format('truetype');
  22. font-weight: normal;
  23. font-style: normal;
  24.  
  25. }
  26.  
  27. @keyframes texxy
  28. {
  29. 0% {
  30. font-size: 12px;
  31. }
  32.  
  33. 25% {
  34. font-size: 15px;
  35. }
  36.  
  37. 50% {
  38. font-size: 18px;
  39. }
  40.  
  41. 75% {
  42. font-size: 22px;
  43. }
  44.  
  45. 100% {
  46. font-size: 26px;
  47. }
  48. }
  49.  
  50.  
  51. @-webkit-keyframes texxy
  52. {
  53. 0% {
  54. font-size: 12px;
  55. }
  56.  
  57. 25% {
  58. font-size: 15px;
  59. }
  60.  
  61. 50% {
  62. font-size: 18px;
  63. }
  64.  
  65. 75% {
  66. font-size: 22px;
  67. }
  68.  
  69. 100% {
  70. font-size: 26px;
  71. }
  72. }
  73.  
  74.  
  75.  
  76.  
  77. @-moz-keyframes texxy
  78. {
  79. 0% {
  80. font-size: 12px;
  81. }
  82.  
  83. 25% {
  84. font-size: 15px;
  85. }
  86.  
  87. 50% {
  88. font-size: 18px;
  89. }
  90.  
  91. 75% {
  92. font-size: 22px;
  93. }
  94.  
  95. 100% {
  96. font-size: 26px;
  97. }
  98. }
  99.  
  100.  
  101. @-webkit-keyframes bounceInUp {
  102. 0% {
  103. opacity: 0;
  104. -webkit-transform: translateY(2000px);
  105. }
  106.  
  107. 60% {
  108. opacity: 1;
  109. -webkit-transform: translateY(-30px);
  110. }
  111.  
  112. 80% {
  113. -webkit-transform: translateY(10px);
  114. }
  115.  
  116. 100% {
  117. -webkit-transform: translateY(0);
  118. }
  119. }
  120. @-moz-keyframes bounceInUp {
  121. 0% {
  122. opacity: 0;
  123. -moz-transform: translateY(2000px);
  124. }
  125.  
  126. 60% {
  127. opacity: 1;
  128. -moz-transform: translateY(-30px);
  129. }
  130.  
  131. 80% {
  132. -moz-transform: translateY(10px);
  133. }
  134.  
  135. 100% {
  136. -moz-transform: translateY(0);
  137. }
  138. }
  139.  
  140. @-o-keyframes bounceInUp {
  141. 0% {
  142. opacity: 0;
  143. -o-transform: translateY(2000px);
  144. }
  145.  
  146. 60% {
  147. opacity: 1;
  148. -o-transform: translateY(-30px);
  149. }
  150.  
  151. 80% {
  152. -o-transform: translateY(10px);
  153. }
  154.  
  155. 100% {
  156. -o-transform: translateY(0);
  157. }
  158. }
  159.  
  160. @keyframes bounceInUp {
  161. 0% {
  162. opacity: 0;
  163. transform: translateY(2000px);
  164. }
  165.  
  166. 60% {
  167. opacity: 1;
  168. transform: translateY(-30px);
  169. }
  170.  
  171. 80% {
  172. transform: translateY(10px);
  173. }
  174.  
  175. 100% {
  176. transform: translateY(0);
  177. }
  178. }
  179.  
  180. .bounceInUp {
  181. -webkit-animation-name: bounceInUp;
  182. -moz-animation-name: bounceInUp;
  183. -o-animation-name: bounceInUp;
  184. animation-name: bounceInUp;
  185. }
  186.  
  187. @-webkit-keyframes pulse {
  188. 0% { -webkit-transform: scale(1); }
  189. 50% { -webkit-transform: scale(1.1); }
  190. 100% { -webkit-transform: scale(1); }
  191. }
  192. @-moz-keyframes pulse {
  193. 0% { -moz-transform: scale(1); }
  194. 50% { -moz-transform: scale(1.1); }
  195. 100% { -moz-transform: scale(1); }
  196. }
  197. @-o-keyframes pulse {
  198. 0% { -o-transform: scale(1); }
  199. 50% { -o-transform: scale(1.1); }
  200. 100% { -o-transform: scale(1); }
  201. }
  202. @keyframes pulse {
  203. 0% { transform: scale(1); }
  204. 50% { transform: scale(1.1); }
  205. 100% { transform: scale(1); }
  206. }
  207.  
  208. .pulse {
  209. -webkit-animation-name: pulse;
  210. -moz-animation-name: pulse;
  211. -o-animation-name: pulse;
  212. animation-name: pulse;
  213. }
  214. </style>
  215.  
  216. <title>Blogroll</title>
  217. <link rel="shortcut icon" href="{Favicon}" />
  218.  
  219.  
  220. <style type="text/css">
  221.  
  222. body{
  223. background-color: #fff;
  224. font-family:arial;
  225. font-size:10px;
  226. line-height: 120%;
  227. text-align:justify;
  228. }
  229.  
  230. a:link, a:active, a:visited{
  231. color: #3e3e3e;
  232. padding: 0 2px;
  233. text-decoration: none;
  234. }
  235.  
  236. a:hover{
  237. background: transparent;
  238. color: #3e3e3e;
  239. }
  240.  
  241. #content {
  242. margin-left:200px;
  243. width:800px;
  244. top:50px;
  245. background: #fff; }
  246.  
  247. #entries {
  248. width:600px;
  249. margin: 10px auto 10px;
  250. padding:10px;
  251. margin-bottom:50px;
  252. margin-top:40px;
  253. }
  254.  
  255. #entries img{
  256. opacity:.8;
  257. -webkit-transition-duration:.7s;
  258. }
  259.  
  260. #entries img:hover{
  261. opacity:2;
  262. -webkit-transform: scale(1.2);
  263. -webkit-box-shadow: -8px 23px 14px rgba(50, 50, 50, 0.86);
  264. -moz-box-shadow: -8px 23px 14px rgba(50, 50, 50, 0.86);
  265. box-shadow: -8px 23px 14px rgba(50, 50, 50, 0.86); -webkit-animation: pulse 2s;
  266. -moz-animation: pulse 2s;
  267. -ms-animation: pulse 2s;
  268. -webkit-transition: 0.2s ease-in;
  269. }
  270.  
  271. #entries img {
  272. border: 1px solid #f7f7f7;
  273. padding: 2px;
  274. width:64px;
  275. height:64px;
  276. }
  277.  
  278. #entries img:hover {
  279. width:64px;
  280. height:64px;
  281. }
  282.  
  283.  
  284.  
  285. .barholder{
  286. -webkit-animation: bounceInUp 2s;
  287. -moz-animation: bounceInUp 2s;
  288. -ms-animation: bounceInUp 2s;
  289. margin-left: 1000px;
  290. height: 100%;
  291. width: 45px;
  292. background-color: #56A5EC;
  293. margin-top: -40px;
  294. position: fixed;
  295. }
  296.  
  297. .volleyball{
  298. width: 100px;
  299. height: 100px;
  300. border-radius: 100px;
  301. margin-left: -25px;
  302. border: 8px double #A3A3A3;
  303. margin-top: 150%;
  304. -webkit-transition: 0.5s;
  305. overflow: hidden;
  306. }
  307.  
  308. .volleyball img{
  309. width: 100px;
  310. height: 100px;
  311. border-radius: 100px;
  312. }
  313.  
  314.  
  315. .volleyball:hover{
  316. -webkit-transform: scale(1.2);
  317. -webkit-transition: 0.7s;
  318.  
  319. }
  320.  
  321. .boxxy{
  322. font-family: Tom Daley;
  323. font-size: 26px;
  324. border-radius: 5px;
  325. margin-top: -60%;
  326. opacity: 0;
  327. line-height: 22px;
  328. width: 100%;
  329. background: #fff;
  330. color: #000;
  331. height: 22px;
  332. text-align: center;
  333. font-size: 20px;
  334. -webkit-transition: 0.7s;
  335. position: absolute;
  336. }
  337.  
  338. .volleyball:hover .boxxy{
  339. font-family: Tom Daley;
  340. -webkit-animation: texxy 2s;
  341. -moz-animation: texxy 2s;
  342. -ms-animation: texxy 2s;
  343. -webkit-transform: rotate(360deg);
  344. opacity: 0.8;
  345. -webkit-transition: 0.7s;
  346. }
  347.  
  348. .cheerleading{
  349. -webkit-animation: bounceInUp 2s;
  350. -moz-animation: bounceInUp 2s;
  351. -ms-animation: bounceInUp 2s;
  352. text-align: center;
  353. margin-top: 3%;
  354. width: 185px;
  355. font-family: titlefont;
  356. font-size: 36px;
  357. height: 30px;
  358. line-height: 30px;
  359. padding-left: 5px;
  360. padding-right: 5px;
  361. padding-top: 5px;
  362. padding-bottom: 10px;
  363. margin-left: -75px;
  364. background-color: #56A5EC;
  365. position: fixed;
  366. }
  367.  
  368.  
  369.  
  370. </style>
  371.  
  372.  
  373.  
  374.  
  375. </div>
  376.  
  377.  
  378.  
  379. <div class="barholder">
  380. <div class="cheerleading">Links</div>
  381. <div class="volleyball"><img src="{PortraitURL-128}"><div class="boxxy"><a href="/">Home</a></div></div>
  382.  
  383. <div class="volleyball" style="margin-top: 20%;"><img src="http://24.media.tumblr.com/tumblr_mdy7qhEqiI1rl9xebo1_500.png"><div class="boxxy"><a href="/ask">Message</a></div></div>
  384.  
  385.  
  386. <div class="volleyball" style="margin-top: 40%;"><img src="http://24.media.tumblr.com/tumblr_mdzjkatCK71rl9xebo1_500.jpg"><div class="boxxy"><a href="http://tumblr.com/dashboard">Dashboard</a></div></div>
  387.  
  388.  
  389.  
  390. <div class="volleyball" style="margin-top: 80%;"><img src="http://25.media.tumblr.com/tumblr_mdy7xlcinP1rl9xebo1_500.gif"><div class="boxxy"><a href="http://neon-themes.tumblr.com/">Theme</a></div></div>
  391.  
  392.  
  393.  
  394.  
  395. </div>
  396.  
  397.  
  398.  
  399. <div id="content">
  400. <div id="entries" >
  401.  
  402. <center>
  403.  
  404. {block:Following}{block:Followed}<a target="_blank" href="{FollowedURL}" title="{FollowedTitle}"><img src="{FollowedPortraitURL-64}" />{/block:Followed}{/block:Following}
  405.  
  406.  
  407. </center> </div></div>
  408.  
  409. </body>
  410. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement