body {

}
.panel {
   width:10px;
   height:auto;
   border-radius:5px;
   position:fixed;
   padding:0px 0px 50px 0px;
   right:0;
   margin-right:5px;
}
.panel li{
   list-style:none;
   float:right;
   display:block;
   margin-right:-150px;
   padding-right:30px;
   padding-top:10px;
   border-top-left-radius:5px;
   border-bottom-left-radius:5px;   
}
.panel:hover li{
   margin-right:0px;    
}
.panel li.buton{
   background-color:#CC0000;
   width:250px;
   height:20px;    
}
.panel li.buton:hover{
   margin-right:0px;
   width:250px;
   background-color:#575756; 
-webkit-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035);     
}
.panel li a{
   text-decoration:none;
   font-family: Arial;
   line-height: 1em;
   color: #fff9d6;
   font-weight:normal;
   font-size: 12px;
  
}

/*  easing   */
.panel li:nth-of-type(1) {
 background-color:#013C63;
-webkit-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 100ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(2) {
 background-color:#013C63;
-webkit-transition: all 200ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 200ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 200ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 200ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(3) {
 background-color:#013C63;
-webkit-transition: all 300ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 300ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 300ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 300ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(4) {
 background-color:#013C63;
-webkit-transition: all 400ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 400ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 400ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 400ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(5) {
 background-color:#013C63;
-webkit-transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(6) {
 background-color:#013C63;
-webkit-transition: all 600ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 600ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 600ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 600ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(7) {
 background-color:#013C63;
-webkit-transition: all 700ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 700ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 700ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 700ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(8) {
 background-color:#013C63;
-webkit-transition: all 800ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 800ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 800ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 800ms cubic-bezier(0.950, 0.050, 0.795, 0.035);
}
.panel li:nth-of-type(9) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(10) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(11) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(12) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(13) {
 background-color:#013C63;
 height:40px;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(14) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(15) {
 background-color:#013C63;

-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(16) {
 background-color:#013C63;
 height:32px;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
.panel li:nth-of-type(17) {
 background-color:#013C63;
-webkit-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
   -moz-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
     -o-transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
        transition: all 900ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}