/*上層選單*/
#TopMenu { width:100%; background-color:#eee; margin:0; }

#TopMenu ul.navigation,ul.navigation li { list-style: none; padding:0; position:initial; z-index:999; }
#TopMenu ul.navigation li { position: relative; float: left; }

#TopMenu ul.navigation li.Home a { background-color:#2077a9; color:#fff; }

/* 選單 li 裡面連結之樣式 */
#TopMenu ul.navigation li a{
    display: block;
    padding: 15px 20px;
    /*background: #336511;*/
    color: #666;
}

/* 特定在第一層，以左邊灰線分隔 */
#TopMenu ul.navigation > li > a{
    /*border-bottom: 1px solid #CCC;    
    border-left: 1px solid #CCC;*/
}

#TopMenu ul.navigation > li > a:hover{
    color: #fff;
    background: #759d83;
}

/* 特定在第一層 > 第二層之後下拉部分之樣式 */
#TopMenu ul.navigation li ul{
    display: none;
    float: left;
    position: absolute;  
    margin: 0;
    padding:0;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
#TopMenu ul.navigation li:hover > ul{
    display: block;
}
/* 特定在第二層或之後下拉部分 li 之樣式 */
#TopMenu ul.navigation ul li {
    border-bottom: 1px solid #DDD;
}
/* 特定在第二層或之後下拉部分 li （最後一項不要底線）之樣式 */
#TopMenu ul.navigation ul li:last-child {
    border-bottom: none;
}

/* 第二層或之後 選單 li 之樣式 */
#TopMenu ul.navigation ul a {
    width: 130px;
    padding: 10px 12px;    
    color: #fff;        
    background: #759d83;
    /*border-left:solid 1px #ddd;*/
}
#TopMenu ul.navigation ul a:hover {        
    background: #dd820b;    
}
/* 第三層之後，上一層的選單觸發則顯示出來（皆為橫向拓展） */
#TopMenu ul.navigation ul li:hover > ul{
    display: block;
    position: absolute;
    top: 0;    
    left: 100%;
}

/* 箭頭向下 */
.arrow-bottom {
    display: inline-block;
    float:right;
    /*margin-left: 5px;
    border-top: 4px solid #FFF;
    border-right: 4px solid transparent;    
    border-left: 4px solid transparent;        
    width: 1px;
    height: 1px;*/
}
/* 箭頭向右 */
.arrow-right {
    display: inline-block;    
    float:right;
    /*margin-left: 12px;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #666;*/        
    /*width: 5px;
    height: 3px;*/
}