
yo la edite con el photoshoop y quedo asi:
y estas son las tres sin editar
tienen que darle al boton que pone reducir hasta ajustar porque sino sale muy grande
y en mi blog de pruebas no se puede ver bien como queda clik para la vista previa
<style>.raejun{width:60px;padding:15px;margin-top:15px;box-shadow:2px 2px 4px #DFDFDF;background:#eee;font:8px tt; text-align:center;Text-decoration:none;color:#888;text-transform:uppercase;display:block;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;border-left:0px solid #000;-webkit-border-top-right-radius: 333px;-webkit-border-bottom-right-radius: 333px;-moz-border-radius-topright: 333px;-moz-border-radius-bottomright: 333px;border-top-right-radius: 333px;border-bottom-right-radius: 333px;}.raejun:hover{width:66px;border-left:10px solid #aaa;}@font-face {font-family:tt !important;src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;}</style><div style="position:fixed; top:100px;left:0px;width:100px; color:#aaa;"><a class="raejun" href="LINK HERE">link 1</a><a class="raejun" href="LINK HERE">link 2</a><a class="raejun" href="LINK HERE">link 3</a><a class="raejun" href="LINK HERE">link 4</a></div>
<style>
.raejun{
width:96px;
padding:2px;
margin-top:5px;
box-shadow:2px 2px 4px #DFDFDF;
background:#eee;
font:8px tt;
text-align:center;
Text-decoration:none;
color:#FF8888;
text-transform:uppercase;
display:block;
-webkit-transition:All 0.5s ease;
-moz-transition:All 0.5s ease;
-o-transition:All 0.5s ease;
border-left:0px solid #FF8888;
}
.raejun:hover{
width:66px;
border-left:30px solid #FFBBBB;
}
@font-face {
font-family:tt !important;
src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;
}
</style>
<div style="background:#eee;color:#fff; position:fixed; top:0px;left:35px;width:10px;height:100px; box-shadow:2px 2px 6px #ddd; text-align:center; font-size:12px; text-transform:uppercase;">
</div>
<div style="background:#eee;color:#fff; position:fixed; top:0px;left:90px;width:10px;height:100px; box-shadow:2px 2px 6px #ddd; text-align:center; font-size:12px; text-transform:uppercase;">
</div>
<div style="position:fixed; top:100px;left:20px;width:100px; color:#aaa;">
<div style="background:#FFBBBB;color:#fff;width:100px; box-shadow:2px 2px 4px #bbb;text-align:center; font-size:12px; text-transform:uppercase;">
Navi</div>
<img src="URL DE TU ICONITO" style="width:80px;border:10px solid #eee;margin-top:5px;box-shadow:2px 2px 4px #ddd;" >
<a class="raejun" href="LINK">texto 1</a>
<a class="raejun" href="LINK">texto 2</a>
<a class="raejun" href="LINK">texto 3</a>
<a class="raejun" href="LINK">texto 4</a>
</div>Thais Kawaii
<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="subir"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2qyB7nhKKLfGeTdph9VStnIAYOvZopwgOZFdrAuQBZOsqdAEirPMUONeWoxgy-lrpb1kd50-AyyVUOZeRQ44EL19DPf8gUYK9TuiDLnsjNOscIou0vNA6gpf3KdsoT67UE3x2hyNpZWE/s1600/E62.gif" /></a>