﻿ul {
      /* 取消ul預設的內縮及樣式 */
      margin: 0;
      padding: 0;
      list-style: none;
    }


    ul.drop-down-menu {
      padding-left: 33;
      border: #ffffff 0px solid;
      display: inline-block;
      font-family: 'Open Sans', Arial, sans-serif;
      font-size: 14px;
      font-weight: bolder;
      /* 字型設定*/
    }

    ul.drop-down-menu li {
      position: relative;
      white-space: nowrap;
      border-right: #ffffff 1px solid;
      border-radius: 20px;
    }

    ul.drop-down-menu>li:last-child {
      border-right: none;
    }

    ul.drop-down-menu>li {

      float: left;
      /* 只有第一層是靠左對齊*/
    }
    
    ul.drop-down-menu>li>ul>li{
        display:inline-block;
    }

    ul.drop-down-menu a {
      border: #ffffff 1px solid;
      border-radius: 5px;
      background-color: #b94fff;
      color: #ffffff;
      display: block;
      padding: 0 12px;
      text-decoration: none;
      line-height: 30px;

    }

    ul.drop-down-menu a:hover {
      /* 滑鼠滑入按鈕變色*/
      border: #ffffff 1px solid;
      background-color: #0000ff;
      color: #FFFFFF;
    }

    ul.drop-down-menu li:hover>a {
      /* 滑鼠移入次選單上層按鈕保持變色*/
      background-color: #0000ff;
      color: #ffffff;
    }

    ul.drop-down-menu ul {
      border: #ffffff 0px solid;
      position: absolute;
      z-index: 99;
      left: -1px;
      top: 100%;
      min-width: 120px;
    }

    ul.drop-down-menu ul li {
      border-bottom: #ffffff 1px solid;
      border-right: #ffffff 1px solid;
      border-left: #ffffff 1px solid;
    }

    ul.drop-down-menu ul li:last-child {
      border-bottom: none;
    }

    ul.drop-down-menu ul ul {
      /*第三層以後的選單出現位置與第二層不同*/
      z-index: 999;
      top: 10px;
      left: 90%;
    }

    ul.drop-down-menu ul {
      /*隱藏次選單*/
      display: none;
    }

    ul.drop-down-menu li:hover>ul {
      /* 滑鼠滑入展開次選單*/
      display: block;
      position:relatvie;
      top:0;
      left:85px;
    }








			/* 加載csshover3.htc，解決IE6沒有li:hover擬類的問題 */
			* html body {
				behavior: url("csshover3.htc");
			}
			/* ---------- 大小與定位 ---------- */
			#emovies {
				/* 選單大小 */
				width: 150px;
				height: 25px;
			}
			#emovies ul {
				/* 取消ul樣式符號 */
				list-style-type: none;
				/* 重設ul邊界與留白為零 */
				margin: 0;
				padding: 0;
				/* 內有浮動元件時，需設overflow才會自動調整大小 */
				overflow: auto;
			}
			* html #emovies ul {
				/* 解決IE6不理overflow問題，直接指定高度 */
				height: 25px;
			}
			#emovies ul li {
				/* 利用float讓第一層li水平排列 */
				float: left;
			}
			/* 解決IE6條列式餘白問題*/
			* html #emovies ul li {
				display: inline;
			}
			#emovies ul li a {
				/* 將a改為區塊元件，以便指定寬高 */
				display: block;
				/* 這邊也要設float，否則IE6會以100%寬度顯示 */
				float: left;
				/* 固定高度 */
				height: 25px;
				width: 150px;
				text-align: center;
			}
			/* 修正IE7絕對定位差異 */
			*:first-child+html #emovies ul li ul {
				margin-top: 0;
			}
			/* 修正IE6絕對定位差異 */
			* html #emovies ul li ul {
				margin-top: 0;
			}
			/* 預設字體 */
			#emovies {
				font-size: 16px;
				font-family: Arial, Helvetica, sans-serif;
			}
			/* 第一層ul背景色彩與邊框 */
			#emovies ul {
                        background: #8030ac;
                        border-radius: 4px;
			}
			/* 第一層a字型 */
			#emovies ul li a {
				color: #FFF;
				font-weight: bolder;
				text-decoration: none;
				line-height: 25px;
			}
			/* 觸動第一層li時，改變背景色 */
			#emovies ul li a:hover,
			#emovies ul li:hover {
				background: #4400CC;
			}
			#emovies ul li:hover a {
				color: #FFFFFF;
				font-weight: bolder;
			}
			
			
			
			
			/* 加載csshover3.htc，解決IE6沒有li:hover擬類的問題 */
			* html body {
				behavior: url("csshover3.htc");
			}
			/* ---------- 大小與定位 ---------- */
			#epicture {
				/* 選單大小 */
				width: 150px;
				height: 25px;
			}
			#epicture ul {
				/* 取消ul樣式符號 */
				list-style-type: none;
				/* 重設ul邊界與留白為零 */
				margin: 0;
				padding: 0;
				/* 內有浮動元件時，需設overflow才會自動調整大小 */
				overflow: auto;
			}
			* html #epicture ul {
				/* 解決IE6不理overflow問題，直接指定高度 */
				height: 25px;
			}
			#epicture ul li {
				/* 利用float讓第一層li水平排列 */
				float: left;
			}
			/* 解決IE6條列式餘白問題*/
			* html #epicture ul li {
				display: inline;
			}
			#epicture ul li a {
				/* 將a改為區塊元件，以便指定寬高 */
				display: block;
				/* 這邊也要設float，否則IE6會以100%寬度顯示 */
				float: left;
				/* 固定高度 */
				height: 25px;
				width: 150px;
				text-align: center;
			}
			/* 修正IE7絕對定位差異 */
			*:first-child+html #epicture ul li ul {
				margin-top: 0;
			}
			/* 修正IE6絕對定位差異 */
			* html #epicture ul li ul {
				margin-top: 0;
			}
			/* 預設字體 */
			#epicture {
				font-size: 16px;
				font-family: Arial, Helvetica, sans-serif;
			}
			/* 第一層ul背景色彩與邊框 */
			#epicture ul {
				background: #8030ac;
				border-radius: 4px;
			}
			/* 第一層a字型 */
			#epicture ul li a {
				color: #FFFFFF;
				font-weight: bolder;
				text-decoration: none;
				line-height: 25px;
			}
			/* 觸動第一層li時，改變背景色 */
			#epicture ul li a:hover,
			#epicture ul li:hover {
				background: #4400CC;
			}
			#epicture ul li:hover a {
				color: #FFFFFF;
				font-weight: bolder;
			}
			
			
			
			
			
			
			/* 加載csshover3.htc，解決IE6沒有li:hover擬類的問題 */
			* html body {
				behavior: url("csshover3.htc");
			}
			/* ---------- 大小與定位 ---------- */
			#backico {
				/* 選單大小 */
				width: 80px;
				height: 25px;
			}
			#backico ul {
				/* 取消ul樣式符號 */
				list-style-type: none;
				/* 重設ul邊界與留白為零 */
				margin: 0;
				padding: 0;
				/* 內有浮動元件時，需設overflow才會自動調整大小 */
				overflow: auto;
			}
			* html #backico ul {
				/* 解決IE6不理overflow問題，直接指定高度 */
				height: 25px;
			}
			#backico ul li {
				/* 利用float讓第一層li水平排列 */
				float: left;
			}
			/* 解決IE6條列式餘白問題*/
			* html #backico ul li {
				display: inline;
			}
			#backico ul li a {
				/* 將a改為區塊元件，以便指定寬高 */
				display: block;
				/* 這邊也要設float，否則IE6會以100%寬度顯示 */
				float: left;
				/* 固定高度 */
				height: 25px;
				width: 80px;
				text-align: center;
			}
			/* 修正IE7絕對定位差異 */
			*:first-child+html #backico ul li ul {
				margin-top: 0;
			}
			/* 修正IE6絕對定位差異 */
			* html #backico ul li ul {
				margin-top: 0;
			}
			/* 預設字體 */
			#backico {
				font-size: 14px;
				font-family: Arial, Helvetica, sans-serif;
			}
			/* 第一層ul背景色彩與邊框 */
			#backico ul {
				background: #7700BB;
			}
			/* 第一層a字型 */
			#backico ul li a {
				color: #FFF;
				font-weight: bolder;
				text-decoration: none;
				line-height: 25px;
			}
			/* 觸動第一層li時，改變背景色 */
			#backico ul li a:hover,
			#backico ul li:hover {
				background: #FFFF00;
			}
			#backico ul li:hover a {
				color: #0000FF;
				font-weight: bolder;
			}
			/* 加載csshover3.htc，解決IE6沒有li:hover擬類的問題 */
			* html body {
				behavior: url("csshover3.htc");
			}
			/* ---------- 大小與定位 ---------- */
			#e1ico {
				/* 選單大小 */
				width: 220px;
				height: 40px;
			}
			#e1ico ul {
				/* 取消ul樣式符號 */
				list-style-type: none;
				/* 重設ul邊界與留白為零 */
				margin: 0;
				padding: 0;
				/* 內有浮動元件時，需設overflow才會自動調整大小 */
				overflow: auto;
			}
			* html #e1ico ul {
				/* 解決IE6不理overflow問題，直接指定高度 */
				height: 40px;
			}
			#e1ico ul li {
				/* 利用float讓第一層li水平排列 */
				float: left;
			}
			/* 解決IE6條列式餘白問題*/
			* html #e1ico ul li {
				display: inline;
			}
			#e1ico ul li a {
				/* 將a改為區塊元件，以便指定寬高 */
				display: block;
				/* 這邊也要設float，否則IE6會以100%寬度顯示 */
				float: left;
				/* 固定高度 */
				height: 40px;
				width: 220px;
				text-align: center;
			}
			/* 修正IE7絕對定位差異 */
			*:first-child+html #e1ico ul li ul {
				margin-top: 0;
			}
			/* 修正IE6絕對定位差異 */
			* html #e1ico ul li ul {
				margin-top: 0;
			}
			/* 預設字體 */
			#e1ico {
				font-size: 14px;
				font-family: Arial, Helvetica, sans-serif;
			}
			/* 第一層ul背景色彩與邊框 */
			#e1ico ul {
				background: #DCDCDC;
				border: solid 1px blue;
				overflow: hidden;
			}
			/* 第一層a字型 */
			#e1ico ul li a {
				color: #0000FF;
				font-weight: bolder;
				text-decoration: none;
				line-height: 40px;
				border: 1px none;
				ridge
			}
			/* 觸動第一層li時，改變背景色 */
			#e1ico ul li a:hover,
			#e1ico ul li:hover {
				background: #0000FF;
			}
			#e1ico ul li:hover a {
				color: #FFFFFF;
				font-weight: bolder; 
			}
			.test {
				float: left; 
			}
			iframe {
		     border:none;
            }
