Elevator Tab for luxurycrystal

paste everything below the dotted line into the <style> section of your html. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

/* elevator tab by ally (stahrfruits) */

#stahrfruits {
    z-index:1000;
    height: 600px; /*height of tab*/
    position: fixed;
    text-align: center;
-webkit-transition-duration: 1.5s; /*how long it takes for it to go up*/
-moz-transition-duration: 1.5s; /*how long it takes for it to go up*/
-o-transition-duration: 1.5s; /*how long it takes for it to go up*/
transition-duration: 1.5s; /*how long it takes for it to go up*/
}

#stahrfruits:hover {
z-index:1000;
bottom: 1205px;
left: 5px;
}

#marc {
bottom: -1200px;
position: absolute;
width: 250px; /*width of tab*/
height: 100%;
overflow: hidden; /*chang to scroll if you want a scrollbar*/
padding: 10px;
background: white; /*tab background color*/
opacity: 1; /*opacity of tab*/
line-height: 13px;
border: 1px solid black; /*tab border*/
text-align: center;
}

.ally {
display: block;
position: fixed;
left: 10px; /*distance from the left side*/
top: 10px; /*distance from the top*/
padding: 3px;
width: 50px; /*width of button*/
height: 50px; /*height of button*/
background-color: transparent; /*background color*/
border-radius: 0px; /*the lower it is, the less round it'll be*/
border: 3px  /*button border*/
overflow: hidden;
}


/* elevator tab */
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

paste everything below the dotted line into the <body> section of your html. --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

<!-- elevator tab by ally (stahrfruits)-->

<div id="stahrfruits">

<!-- tab image -->
<span class="ally">
<img src="http://i44.tinypic.com/2cdh9i1.png" width="80">
</span>
<!-- tab image -->

<div id="marc">
 <br>
<img src="http://i42.tinypic.com/2potis1.png" width="50">
<p>
<div style="background: #000000;padding: 5px;font-size: 16px;">Announcements</div><p>

add your announcements in this box :)

</p>

<div style="background: #000000; padding: 5px;font-size: 16px;">Social</div><p>

place your social networks in this area

 </p>

<div style="background: #000000; padding: 5px;font-size: 16px;">Something Else</div><p>

put anything you'd like to here

 </p>

<div style="background: #000000;padding: 5px;font-size: 16px;">Networks</div><p>

<marquee> put your network images and other network related stuff here and it will scroll past </marquee>

</p>

<br>
<br>

<img src="http://i42.tinypic.com/2potis1.png" width="50">
</div>

</div>

</div>

<!-- elevator tab -->