HTML
1
<section id="btn">
2
<p>47k fans</p>
3
<div id="facebook">
4
<div class="logo"><div class="recto"></div></div>
5
<div class="top"></div>
6
<div class="logo verso"></div>
7
</div>
8
<div id="shadow"><img src="http://www.cssdeck.com/uploads/media/items/9/98AayKh.png" alt="shadow" /></div>
9
</section>
CSS
1
* {margin: 0; padding: 0;}
2
3
body {
4
background:#e9edee;
5
}
6
7
#btn {
8
width:103px;
9
height: 35px;
10
position: absolute;
11
top: 50%;
12
left: 50%;
13
margin: -17px 0 0 -51px;
14
15
background-color: #d6dbde;
16
background: #d6dbde -webkit-linear-gradient(bottom, rgb(215,219,222) 0, rgb(216,220,221) 60%, rgb(193,199,202) 100%);
17
-webkit-box-shadow: inset 0px 0px 5px rgba(0,0,0,.2), 0px 1px 1px rgba(0,0,0,.5);
18
19
background: #d6dbde -moz-linear-gradient(bottom, rgb(215,219,222) 0, rgb(216,220,221) 60%, rgb(193,199,202) 100%);
20
-moz-box-shadow: inset 0px 0px 5px rgba(0,0,0,.2), 0px 1px 1px rgba(0,0,0,.5);
21
22
text-align: center;
23
border-radius: 2px;
24
line-height: 35px;
25
color: #4a66a7;
26
font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
27
font-size: .8em;
28
font-weight: bold;
29
30
-webkit-perspective: 200;
31
-webkit-perspective-origin: 50% 0;
32
33
-moz-perspective: 200;
34
-moz-perspective-origin: 50% 0;
35
}
36
37
#facebook {
38
width: 103px;
39
height: 35px;
40
text-indent: -9999px;
