slide out status

Slide out Status tab

Paste this code under your <head> tag

<meta name="text:status" content="This is where your status goes, to change it does go to customize, and scroll down until you see status and change the text" />

    #cherrybomb {
-moz-box-shadow: 0px 0px 0px 0px ;
-webkit-box-shadow: 0px 0px 0px 0px ;
box-shadow: 0px 0px 0px 0px ;
position: fixed;
top: 44px;
left: 1px;
width: 18px;
text-align: center;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-border-radius: 0 5px 5px 0;
-moz-border-radius: 0 5px 5px 0;
border-radius: 0 5px 5px 0;
background-color: #fff;
border: 2px solid #fcf;
height: 70px;
padding: 10px;

#runaway {

-moz-box-shadow: 0px 0px 1px 0px ;
-webkit-box-shadow: 0px 0px 1px 0px ;
box-shadow: 0px 0px 1px 0px ;
top: 40px;
left: -250px;
position: fixed;
background: ;
width: 230px;
padding: 10px;
background: #FFFFFF; 
min-height: 90px;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
text-align: left;
-webkit-border-radius: 0 0 5px 0;
-moz-border-radius: 0 0 5px 0;
border-radius: 0 0 5px 0;}

#cherrybomb:hover {
left: 250px;}

#cherrybomb:hover #runaway {
left: 0px;}

#runaway:hover {
left: 0px;

.fire {
display: block;
writing-mode: lr-tb;
-webkit-transform: rotate(-90deg); 
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
position: absolute;
left: -11px;
top: 30px;
font-size: 20px;
font-weight: normal;
text-transform: uppercase; 
letter-spacing: -1px;}


Now paste this code under your <body> tag

<div id="cherrybomb">
<span class="fire">


<div id="runaway">


Now to change your status, just go to your customize screen, and change the text under status like show below