Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

Untitled

By: a guest on Jun 30th, 2012  |  syntax: None  |  size: 1.13 KB  |  hits: 15  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /**
  2.  * The first commented line is your dabblet’s title
  3.  */
  4.  
  5. body {
  6.         background: #fff;
  7. }
  8.  
  9. ul {
  10.         margin: 200px 0 0;
  11.         padding: 0;
  12.         list-style-type: none;
  13.         float: left;
  14. }
  15.  
  16. li {
  17.         float: left;
  18.         margin: 0 0 0 30px;
  19.         position: relative;
  20. }
  21.  
  22. a {
  23.         color: rgba(0,0,0,0.9);
  24.         border-radius: 50%;
  25.         background: rgba(255,255,255,1);
  26.         width: 100px;
  27.         height: 0;
  28.         padding: 40px 0 60px;
  29.         display: block;
  30.         text-align: center;
  31.         text-decoration: none;
  32.         transition: all 0.2s ease-out;
  33.         box-sizing: border-box;
  34.         transform: rotate(-20deg);
  35. }
  36. span {
  37.         background: white;
  38.         width: 110px;
  39.         height: 110px;
  40.         display: block;
  41.         position: absolute;
  42.         top: -5px;
  43.         left: -5px;
  44.         z-index: -2;
  45.         border-radius: 50%;
  46.         transition: all 0.2s ease-out;
  47.         /*border: 1px solid rgba(0,0,0,0.2);*/
  48.         box-shadow: inset 0px 0px 1px rgba(0,0,0,0.3);
  49. }
  50. li:hover span {
  51.         transform: scale(1.2);
  52.         background: rgba(103,0,0,0.8);
  53.         z-index: -1;
  54.         box-shadow: inset 0px 0px 10px rgba(0,0,0,1);
  55. }
  56. li:hover a {
  57.         transform: scale(0.8);
  58.         box-shadow: 0px 0px 10px rgba(0,0,0,1);
  59.         background:rgba(255,255,255,1);
  60.         color: rgba(0,0,0,0.9);
  61.         /*width: 80px;
  62.         padding: 30px 0 50px;*/
  63. }
  64. li:hover a:active {
  65.         transform: scale(0.7);
  66. }
create a new version of this paste RAW Paste Data