Cajita Status Bear ♡

♡ Live preview ♡

Para añadirlo a tu blog sigue los siguientes pasos:

Diseño > Añadir Gadget HTML

Copia y pega el siguiente código ˖⁺‧₊˚♡˚₊‧⁺˖

Box Bear

<style>

.hover {

text-align:center;

margin-top:60px;

margin-left:210px;

-moz-transition: all 0.8s ease-in-out;

-o-transition: all 0.8s ease-in-out;

-ms-transition: all 0.8s ease-in-out;

transition: all 0.8s ease-in-out;

}

#stat {

position:fixed;

width:200px;

left:-215px;

top:70px; /*the position of slide box minimum 0*/

height:105px;

border-radius:0px 70px 70px 0px;

border-right:55px solid #F0DFAC;

padding:6px;

background-color:#F0DFAC;

color:#333333;

-moz-transition: all 0.8s ease-in-out;

-o-transition: all 0.8s ease-in-out;

-ms-transition: all 0.8s ease-in-out;

transition: all 0.8s ease-in-out;

}

#stat:hover {

left:0px;

}

.text {

padding:4px;

height:88px;width:90%;

margin-top:-98px;

text-align:left;

overflow-y:scroll;

overflow-x:hidden;

border:2px solid #FAE9BA;

font:12px Century Gothic;

color:#444444;

background-color:#FFECE4;

}

#ear1 {

background-color:#F0DFAC;

height:40px; width:35px;

margin-top:-67px;margin-left:25px;

border-radius:50px 100px 100px 50px;

-webkit-transform: rotate(-35deg); -moz-transform: rotate(-35deg); -o-transform: rotate(-35deg);transform: rotate(-35deg);

}

#ear2 {

background-color:#F0DFAC;

height:40px; width:35px;

margin-top:35px;margin-left:25px;

border-radius:50px 100px 100px 50px;

-webkit-transform: rotate(35deg); -moz-transform: rotate(35deg); -o-transform: rotate(35deg);transform: rotate(35deg);

}

#eye1 {

background-color:#777777;

height:10px; width:10px;

margin-top:-40px;margin-left:12px;

border-radius:100%;

}

#eye2 {

background-color:#777777;

height:10px; width:10px;

margin-top:-53px;margin-left:12px;

border-radius:100%;

}

#nose {

background-color:#C09E89;

height:15px; width:10px;

font:20px arial;

font-weight:bold;

border-radius:100%;

margin-top:10px; margin-left:2px;

}

#lobe1 {

background-color:#D6C0A3;

height:20px; width:15px;

margin-top:-58px;margin-left:38px;

border-radius:50px 100px 100px 50px;

-webkit-transform: rotate(-35deg); -moz-transform: rotate(-35deg); -o-transform: rotate(-35deg);transform: rotate(-35deg);

}

#lobe2 {

background-color:#D6C0A3;

height:20px; width:15px;

margin-top:56px;margin-left:38px;

border-radius:50px 100px 100px 50px;

-webkit-transform: rotate(35deg); -moz-transform: rotate(35deg); -o-transform: rotate(35deg);transform: rotate(35deg);

}

</style>

<center><div id="stat"><div class="hover">

<div id="ear1"></div><div id="ear2"></div><div id="eye1"></div><div id="eye2"></div>

<div id="nose"></div><div id="lobe1"></div><div id="lobe2"></div>

</div>

<div class="text">YOUR STATUS HERE</div>

</div>

</center>

 Byebye ! ˖⁺‧₊˚♡˚₊‧⁺˖