basti1012.bplaced.net

Hallo liebe Community, ich habe im Netz ein CSS Slider Button Code Schnipsel gefunden. Dieser gefällt mir und ich möchte den gerne nutzen, jedoch soll das sliden in die andere Richtung gehen, also soll der Slider beim Mouseover nach links sliden anstatt nach rechts. Wer kann mir da helfen?

Code

                                    
                                <style>
  .button {
  position: relative;
  left:10px;
  height: 50px;
  width: 50px;
  margin:10px 0;
  padding:7px 0 0 8px;
  border: 1px solid #898989;
  background:#dae9b4;
  overflow:hidden;
  transition:width 1s ease-in-out;
  box-sizing: padding-box;
  box-sizing:border-box;
  border-radius:25px;
  float:right;
 }

.button:hover {
  width: 170px;
  background:#dae9b4;
  }

.button span{ 
  opacity:0;
  position:absolute;
  top:14px;
  left:58px;
  transition:opacity 1s linear 0.5s;
  }

.button:hover span { opacity:1; }

.button a {
  color:#000;
  font-weight:bold;
  text-shadow: 0 2px 3px #898989;
  }
    #helfer{
    position:absolute;
    left:0px;
    width:180px;
  }
  
</style>
<div id="helfer">
<div class="button">
  <a href="#">
    <img src="/image/1.png" width="32" height="32" /><span>Text</span>
  </a>
   </div> </div>