lib/generators/rsocialize/templates/example2.css
#example2{
float:left;
margin:80px 42% 0 42%;
}
.sharrre .box{
background:#6f838c;
background:-webkit-gradient(linear,left top,left bottom,color-stop(#6f838c,0),color-stop(#4d5e66,1));
background:-webkit-linear-gradient(top, #6f838c 0%, #4d5e66 100%);
background:-moz-linear-gradient(top, #6f838c 0%, #4d5e66 100%);
background:-o-linear-gradient(top, #6f838c 0%, #4d5e66 100%);
background:linear-gradient(top, #6f838c 0%, #4d5e66 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6f838c', endColorstr='#4d5e66',GradientType=0 );
-webkit-box-shadow:0 1px 1px #d3d3d3;
-moz-box-shadow:0 1px 1px #d3d3d3;
box-shadow:0 1px 1px #d3d3d3;
height:22px;
display:inline-block;
position:relative;
padding:0px 55px 0 8px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
font-size:12px;
float:left;
clear:both;
overflow:hidden;
-webkit-transition:all 0.3s linear;
-moz-transition:all 0.3s linear;
-o-transition:all 0.3s linear;
transition:all 0.3s linear;
}
.sharrre .left{
line-height:22px;
display:block;
white-space:nowrap;
text-shadow:0px 1px 1px rgba(255,255,255,0.3);
color:#ffffff;
-webkit-transition:all 0.2s linear;
-moz-transition:all 0.2s linear;
-o-transition:all 0.2s linear;
transition:all 0.2s linear;
}
.sharrre .middle{
position:absolute;
height:22px;
top:0px;
right:30px;
width:0px;
background:#63707e;
text-shadow:0px -1px 1px #363f49;
color:#fff;
white-space:nowrap;
text-align:left;
overflow:hidden;
-webkit-box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
-moz-box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
-webkit-transition:width 0.3s linear;
-moz-transition:width 0.3s linear;
-o-transition:width 0.3s linear;
transition:width 0.3s linear;
}
.sharrre .middle a{
color:#fff;
font-weight:bold;
padding:0 9px 0 9px;
text-align:center;
float:left;
line-height:22px;
-webkit-box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
-moz-box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
box-shadow:-1px 0px 1px rgba(255,255,255,0.4), 1px 1px 2px rgba(0,0,0,0.2) inset;
}
.sharrre .right{
position:absolute;
right:0px;
top:0px;
height:100%;
width:45px;
text-align:center;
line-height:22px;
color:#4b5d61;
background:#f1faf9;
background:-webkit-gradient(linear,left top,left bottom,color-stop(#f1faf9,0),color-stop(#bacfd2,1));
background:-webkit-linear-gradient(top, #f1faf9 0%, #bacfd2 100%);
background:-moz-linear-gradient(top, #f1faf9 0%, #bacfd2 100%);
background:-o-linear-gradient(top, #f1faf9 0%, #bacfd2 100%);
background:linear-gradient(top, #f1faf9 0%, #bacfd2 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1faf9', endColorstr='#bacfd2',GradientType=0 );
}
.sharrre .box:hover{
padding-right:130px;
}
.sharrre .middle a:hover{
text-decoration:none;
}
.sharrre .box:hover .middle{
width:90px;
}