triangle O:

!--start-->

<meta name="if:Show firsttriangle" content="1" />


<meta name="color:triangle 1" content="#E66C50"/>
<meta name="color:main border" content="#ffffff"/>
 !---above <style type="text/css"> ---->

{block:ifshowfirsttriangle}#buttsex {

    font-family:calibri;
    color:#000000;
    z-index:3;
    overflow:hidden;
    height:0px;
        width:120px;
    position:fixed;
    margin-left:5px;
    margin-top:162px;
    width:120px;
        border-top: 18px solid transparent;
        border-left: 20px solid {color:triangle 1};
        border-bottom: 18px solid transparent;
    ;-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;



}

    #buttsex:hover {
          background-color:#fcf2f0;
        border-top: 0px solid transparent;
        border-bottom: 0px solid transparent;
        height:160px; /* --- <<<<<this is where you change the height of the box for the FIRST triangle ---*/
        width:200px;
        border-left: 10px solid {color:main border};
      ;-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;



    }



    #inside {
       text-transform:uppercase;
       border:1px solid #000000;
        letter-spacing:1px;
        font-size:13px;
        width:190px;
        padding:5px;
        opacity:0;
        position:absolute;
        text-align:center;
        line-height:100%;

        ;-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
    }

    #buttsex:hover #inside {
        opacity:1;
          ;-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
    }
    {/block:ifshowfirsttriangle}




}


/*<--end-->


!----under body-->

<div id="buttsex">
<span id="titleyo"></span>
<div id="inside">
<p align="center">
////-100 Death ////-71 Life ////-11 Storm ////-2 Balance

</div></div>