Bouton Push Variation

by polinux

HTML

<div id="test1">test1</div>
<div id="test2">test2</div>

CSS

#test1, #test2 {
    margin:16px;
  height:32px;
  line-height:32px;
  color:#FFF;
  text-shadow:0 -1px 1px rgba(0,0,0,.5);
  font-size:16px;
  font-weight:bold;
  position:relative;
  display:inline-block;
  padding:0 14px;
  border:2px solid #911208;
  border-bottom:1px solid #911208;
  -moz-border-radius:6px;
  border-radius:6px;
  cursor:pointer;
  background: #ff5934;
  background: -moz-linear-gradient(top, #ff5934 0%, #dc4116 50%, #d02e17 51%, #b21109 100%);
  background: linear-gradient(top, #ff5934 0%,#dc4116 50%,#d02e17 51%,#b21109 100%);
  -moz-box-shadow:0 1px 1px #000;
  box-shadow:0 1px 1px #000;
}

#test2:before {
  content:'';
  position:absolute;
  -moz-border-radius:5px;
  border-radius:5px;
  top:-5px;
  left:-5px;
  right:-5px;
  bottom:-5px;
  -webkit-border-radius:8px;
  -moz-border-radius:8px;
  border-radius:8px;
  background: #ba1f17;
  z-index:-1;}

#test1:before {
   content:'azer';
  position:absolute;
  -moz-border-radius:5px;
  border-radius:5px;
  top:-15px;
  left:-15px;
  right:-5px;
  bottom:-5px;
  -moz-border-radius:8px;
  border-radius:8px;
  background: silver;
  z-index:-1;}