ul#nav {
             display                  : block;
             height                   : 100px;
             margin                   : 0;
             width                    : 160px;
             margin                   : -20px auto 15px 0px;
             padding                  : 5px 15px 5px 0px;
             position                 : absolute;
}


@-moz-keyframes custom_effect {
      0% {
             background               : rgba(255, 255, 255, 0.0);
             height                   : 30px;
         }
     33% {
             background               : rgba(255, 255, 255, 0.0);
             height                   : 130px;
         }
     66% {
             background               : rgba(255, 255, 255, 1.0);
         }
    100% {
             background               : rgba(239, 108, 0, 0.8);
             height                   : 130px;
         }
}
@-webkit-keyframes custom_effect {
      0% {
             background               : rgba(255, 255, 255, 0.0);
             height                   : 30px;
         }
     33% {
             background               : rgba(255, 255, 255, 0.0);
             height                   : 130px;
         }
     66% {
             background               : rgba(255, 255, 255, 1.0);
         }
    100% {
             background               : rgba(239, 108, 0, 0.8);
             height                   : 130px;
         }
}
ul#nav li {
        -moz-border-radius            : 0px 0px 5px 0px;
         -ms-border-radius            : 0px 0px 5px 0px;
     -webkit-border-radius            : 0px 0px 5px 0px;
          -o-border-radius            : 0px 0px 5px 0px;
             border-radius            : 0px 0px 5px 0px;
             background-color         : transparent;
             border                   : 1px solid #ffffff;
             display                  : block;
             height                   : 30px;
             line-height              : 30px;
             margin-top               : 1px;
             margin-bottom            : 1px;
             margin-left              : 0px;
             overflow                 : hidden;
}
ul#nav li:hover {
        -moz-animation-name           : custom_effect;
        -moz-animation-duration       : 0.4s;
        -moz-animation-timing-function: ease;
        -moz-animation-iteration-count: 1;
        -moz-animation-direction      : normal;
        -moz-animation-delay          : 0;
        -moz-animation-play-state     : running;
        -moz-animation-fill-mode      : forwards;

     -webkit-animation-name           : custom_effect;
     -webkit-animation-duration       : 0.4s;
     -webkit-animation-timing-function: ease;
     -webkit-animation-iteration-count: 1;
     -webkit-animation-direction      : normal;
     -webkit-animation-delay          : 0;
     -webkit-animation-play-state     : running;
     -webkit-animation-fill-mode      : forwards;
             border                   : 1px solid #ef6c00;
             background               : rgba(245, 180, 0, 0.8);
             height                   : 85px;
}


ul#nav a {
             border-style             : none;
             border-width             : 0;
             color                    : #FFFFFF;
             cursor                   : pointer;
             float                    : left;
             font-size                : 13px;
             font-weight              : bold;
             line-height              : 20px;
             margin-top               : 100px;
             padding-left             : 18px;
             text-align               : left;
             text-decoration          : none;
             text-shadow              : 0 1px 1px #3a4559;
             vertical-align           : middle;
        -moz-transition               : all 0.1s 0.4s;
         -ms-transition               : all 0.1s 0.4s;
          -o-transition               : all 0.1s 0.4s;
     -webkit-transition               : all 0.1s 0.4s;
             transition               : all 0.1s 0.4s;
}
ul#nav a:hover {
             text-decoration          : underline;
}
ul#nav li a:first-child {
             display                  : block;
             float                    : none;
             line-height              : 30px;
             margin-top               : 0;
}

ul#nav li:hover a:first-child {
             line-height              : 30px;
}

ul#nav li:hover a {
             margin-top               : 0;
}