@font-face
{
font-family:SEGOEUI;
src: url(../fonts/SEGOEUI.TTF);
} 

#cssmenu ul { margin: 0; padding: 0;}

#cssmenu li { margin: 0; padding: 0;}

#cssmenu a { margin: 0; padding: 0;}

#cssmenu ul {list-style: none;}

#cssmenu a {text-decoration: none;}

#cssmenu {width:680px;float:left; margin-top:20px;}





#cssmenu > ul > li {

    float: left;

    margin-left: 12px;

    position: relative;

}



#cssmenu > ul > li > a {

    color: #000000;

    font-family:"SEGOEUI";

    font-size: 14px;

    line-height: 70px;

    padding: 15px 20px;

-webkit-transition: color .15s;

   -moz-transition: color .15s;

     -o-transition: color .15s;

        transition: color .15s;

}



#cssmenu > ul > li > a:hover {color:#FFCC33; }



#cssmenu > ul > li > ul {

    opacity: 0;

    visibility: hidden;

    padding: 16px 0 20px 0;

    background-color: rgb(250,250,250);

    text-align: left;

    position: absolute;

    top: 55px;

    left: 50%;

    margin-left: -90px;

    width: 180px;

-webkit-transition: all .3s .1s;

   -moz-transition: all .3s .1s;

     -o-transition: all .3s .1s;

        transition: all .3s .1s;

-webkit-border-radius: 5px;

   -moz-border-radius: 5px;

        border-radius: 5px;

-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

   -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

        box-shadow: 0px 1px 3px rgba(0,0,0,.4);

}



#cssmenu > ul > li:hover > ul {

    opacity: 1;

    top: 65px;

    visibility: visible;

}



#cssmenu > ul > li > ul:before{

    content: '';

    display: block;

    border-color: transparent transparent rgb(250,250,250) transparent;

    border-style: solid;

    border-width: 10px;

    position: absolute;

    top: -20px;

    left: 50%;

    margin-left: -10px;

}



#cssmenu > ul ul > li { position: relative;}



#cssmenu ul ul a{

    color:#000000;

    font-family:"SEGOEUI";

    font-size: 13px;

    background-color: rgb(250,250,250);

    padding: 5px 8px 7px 16px;

    display: block;

-webkit-transition: background-color .1s;

   -moz-transition: background-color .1s;

     -o-transition: background-color .1s;

        transition: background-color .1s;

}



#cssmenu ul ul a:hover {background-color: rgb(240,240,240);}





#cssmenu ul ul ul {

    visibility: hidden;

    opacity: 0;

    position: absolute;

    top: -16px;

    left: 206px;

    padding: 16px 0 20px 0;

    background-color: rgb(250,250,250);

    text-align: left;

    width: 160px;

-webkit-transition: all .3s;

   -moz-transition: all .3s;

     -o-transition: all .3s;

        transition: all .3s;

-webkit-border-radius: 5px;

   -moz-border-radius: 5px;

        border-radius: 5px;

-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

   -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

        box-shadow: 0px 1px 3px rgba(0,0,0,.4);

}





#cssmenu ul ul > li:hover > ul { opacity: 1; left: 196px; visibility: visible;}





#cssmenu ul ul a:hover{

    background-color:#FFCC33;

    color:#FFFFFF;

}