﻿
/* web 黃金存摺  */

.page {
	/*width: 100%;*/
	border:0; 
	margin: 0 auto; 

	padding: 4px 2px 0 2px;   /*1px 5px, fix padding ori= 1em*/
	overflow-x: hidden; 
	overflow-y: visible; 
	text-shadow: none; /* new */
}

.block {
	display:block;
}


/* ----------- 	grid layout		----------- */

.ui-grid-a, .ui-grid-b, .ui-grid-c, .ui-grid-d {
	overflow: hidden;
}
.ui-grid-a > .ui-block-a,
.ui-grid-a > .ui-block-b {
	/* width: 49.95%; IE7 */
	/* margin-right: -.5px; BB5 */
	width: 50%;
}
.ui-grid-b > .ui-block-a,
.ui-grid-b > .ui-block-b,
.ui-grid-b > .ui-block-c {
	/* width: 33.25%; IE7 */
	/* margin-right: -.5px; BB5 */
	width: 33.333%;
}
.ui-grid-c > .ui-block-a,
.ui-grid-c > .ui-block-b,
.ui-grid-c > .ui-block-c,
.ui-grid-c > .ui-block-d {
	/* width: 24.925%; IE7 */
	/* margin-right: -.5px; BB5 */
	width: 25%;
}
.ui-grid-d > .ui-block-a,
.ui-grid-d > .ui-block-b,
.ui-grid-d > .ui-block-c,
.ui-grid-d > .ui-block-d,
.ui-grid-d > .ui-block-e {
	/* width: 19.925%; IE7 */
	width: 20%;
}

.ui-block-a, .ui-block-b, .ui-block-c, .ui-block-d, .ui-block-e {
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	min-height: 1px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/* force new row */
.ui-block-a {
	clear: left;
}

/* block 內的項目 */
[class*="ui-block-"] > * {
	margin-right: 0.0em;
	margin-left: 0.0em;
}
 

/* grid 內的 MENU 項目 */
[class*="ui-block-"] > .menuitem {
	-moz-user-select: none;
	display: block;
	font-size: 17px;
	margin: 0.2em 0.2em;
	overflow: hidden;
	padding: 0.5em 0.5em;
	position: relative;
	text-align: center;
	/* text-overflow: clip;   不要 隱藏過多的文字 */
	white-space: nowrap;

	color:#FFFFFF; 
	background: none repeat scroll 0 0 #161616;
	border: 1px solid #bbb;
	cursor: pointer;
	text-shadow: none;  	 /*0 0px 0 #F3F3F3;*/
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
/* (END) 針對OS用超大字型, 調整首頁的MENU grid  */


/* 2016.05, 首頁 menu item 點擊時 加上反白效果 */
[class*="ui-block-"] > a.menuitem:active {
	background-color: #555555; 
}



.menu {
	width: 100%; 
	text-align: center;
	padding: 8px;
}

.menuitem.outstanding {color: #FFD700;		/* mod DAA520 CC3333 */}
.menuitem.fxmkt { color: #00ccff;		/* mod DAA520 CC3333 */ }


.ui-btn {
	color: #FFFFFF;		/* mod */
	background: none repeat scroll 0 0 #2a2a2a;
	border: 1px solid #bbb;
	text-shadow: none; /*0 0px 0 #F3F3F3;*/
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/* 被點擊的項目, ex. 首頁 menu */
.ui-btn.active{
	background: none repeat scroll 0 0 #444;
	border: 1px solid #666;
	color: #EEE;
}

/* 系統公告 */
fieldset.announce {
	padding: 0px;
	margin:15px 5px;
	/*width: 98%;*/
	border: 1px solid #bbb;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
}

fieldset.announce legend {
	font-size: 18px;
	font-weight: normal;
	text-align: center;
	padding-left: 5px;
	/*background:#fff;*/
}

fieldset.announce ul {
	margin: 10px 0 10px 8px;
	list-style: none outside none;	
}

fieldset.announce ul li {	
	text-align: left;
	margin-top:12px;
}


/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	select {padding-right:18px}
}


input[type="text"], input[type="number"] {
	background: transparent none repeat scroll 0 0;
	/*border: 1px solid #bbb; 
	border-radius: 5px;*/
	border:none; 
	border-bottom: 1px solid #bbb; 
	margin: 0;
	line-height: 1.4em;
	min-height: 30px;
	color: #fff; 
	text-align: left;
	font-size: 1em;
	outline: 0 none;
	padding: 3px 5px;
}


 
 /*  *** 	客製化	checkbox  要搭配 check_radio_sheet.png  *** 
				客製化	checkbox  
 */

input[type="checkbox"] {
	/*display:none;*/
}

input[type="checkbox"] + label{
	/*display:block;*/
	padding: 7px 7px;     /* checkbox的padding 要與radio的一致, 高度才會對 */
	color: #eee;   /* 未勾的, 先稍不明顯 */
	/*background-color:#444;
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;*/
}

.extend input[type="checkbox"] + label{
	display: block;
	background-color:#222;
	margin-top: 3px;
	padding: 7px 7px;     /* checkbox的padding 要與radio的一致, 高度才會對 */
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
 

/* 被勾選的, 顏色改回全白, 較明顯 */
input[type="checkbox"]:checked + label {
	color: #FFF; 
}




input[type="checkbox"] + label span {
	display:inline-block;
	width:19px;
	height:19px;
	margin:-1px 4px 0 0;
	vertical-align:middle;
	background:url(../images/check_radio_sheet.png) left top no-repeat;
	cursor:pointer;
}
input[type="checkbox"]:checked + label span {
	background:url(../images/check_radio_sheet.png) -19px top no-repeat;
}


 /*	radio button  要搭配 check_radio_sheet.png
		radio button 
 */
 input[type="radio"] {
	/*display:none;*/
	margin-right:5px;
}

input[type="radio"] + label {
	color: #ddd;   /* 未勾的, 先稍不明顯 */
	padding: 8px 5px 8px 6px;
	cursor: pointer;
	/* 不做出外框, 所以不需bg  :::
	background-color:#555;
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;*/ 	
}



/* 被點選的, 顏色改回全白, 較明顯 
input[type="radio"]:checked + label {	color: #FFF; } */
input[type="radio"]:checked + label{
	color: #45cae7; 
} 

/* .highlight-bg block內的radios,  被點選的radio
.normal input[type="radio"]:checked + label {
	color: #DAA520;  /改成變換字的顏色/
}
*/



/* 包於.extend內的, 要延展成全版寬度 */
.extended input[type="radio"] + label {	
	display:block;
	border: 1px solid #222;   /* 要設border, 且border color要設成跟bgcolor一樣, 這樣被點擊時, 高度才不會變動 */
	background-color:#222; 
	margin-top: 3px;
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.extended input[type="radio"]:checked + label {
	border: 2px solid #666; 
}

.inline-block input[type="radio"] + label {
	/*width: 85%;*/ 
	display:inline-block;
	border: 1px solid #222;   /* 要設border, 且border color要設成跟bgcolor一樣, 這樣被點擊時, 高度才不會變動 */
	background-color:#222; 
	margin-top: 8px;
	border-radius: 5px;
}

.inline-block input[type="radio"]:checked + label {
	border: 1px solid #00ccff; 
	font-weight:bold; 
	/*font-size: 17px;*/
}


input[type="radio"] + label span {
	display:inline-block;
	width:20px;
	height:20px;
	margin:-1px 0px 0 0;
	vertical-align:middle;
	background:url(../images/check_radio_sheet.png) -38px top no-repeat;
	cursor:pointer;
}

input[type="radio"]:checked + label span {
	background:url(../images/check_radio_sheet.png) -57px top no-repeat;
}



/*	調整  到價警示  設定 的 radio buttons  */  
input[type="radio"] + label.bid {	
	color: #00B800; 
}
input[type="radio"] + label.ask {	
	color: #FF5566; 
}
input[type="radio"] + label.mid {	
	color: #fff; 
}

/* disabled 不可選的radio, 顏色變暗 */
input[type="radio"] + label.disabled {	
	color: #777; 
	cursor: none;
}



/*  ----------  table  ---------- */

table.grid {width: 100%; padding: 0px; margin-bottom: 5px;}
table.grid td {padding-right: 2px;}
table.grid td.L {text-align: left;}
table.grid td.C {text-align: center;}
table.grid td.R {text-align: right;}

/*  tabele.quote & quote Thead */
table.quote, table.quoteHead {
	color: #FFFFFF;
	width: 100%;
	font-size: 18px;
	padding: 0;
	border: 0;
	margin-top: 0px;
	margin-bottom: 15px;
}

table.quoteHead {
	margin-bottom: -5px;
}


table.mgt20  {margin-top: 20px;} 
table.mgt25  {margin-top: 25px;} 

table.quote th, table.quoteHead th {
	color: #ddd; 
	font-size: 17px;
	height: 30px;
	padding: 2px 0 2px 0;
	text-align: center;
	/*background-color: #E6E6E6;*/
	border-top: 0;  /* 不要有border-top*/
	border-bottom: 2px solid #aaa;  /*bottom由 first td來處理?? */
}

table.quote thead th, table.quoteHead thead th {
	padding: 20px 0 0 0;
}

table.quote thead:first-child th, table.quoteHead thead:first-child th {
	padding: 5px 0 0 0;
}

table.quote thead th.small {
	font-size: 15px;
	font-weight: normal; 
}

/* 國際匯市 thead無需 border-top */
table.quote.no_border_top th, table.quoteHead.no_border_top th {
	border-top: 0;
}


table.quote th.sort,
table.quoteHead th.sort {color: #DAA520; height: 30px;} /*text-decoration: underline;*/

table.quote th.sort:active,
table.quoteHead th.sort:active {font-weight:bold; color: #FF6600;} 

table.quote th.sort .sortsym, 
table.quoteHead th.sort .sortsym{font-size:15px; color: #DAA520; /* color: #DDDD88; text-decoration: underline; */ }

table.quote th.sort .sortsym, 
table.quoteHead th.sort.on{color: #DAA520;} /* #990000*/


table.quote th.L, table.quoteHead th.L {text-align: left;}
table.quote th.R, table.quoteHead th.R {text-align: right;}
table.quote th.C, table.quoteHead th.C {text-align: center;}

table.quote td {
	height: 35px;
	text-align: center;
	padding: 6px 2px 0 1px;
	border-bottom: solid 1px #666666;
}

/*
table.quote tr.first td {
	border-top: solid 2px #BBBBBB;
}

table.quote tr.last td {
	border-bottom: solid 3px #BBBBBB;
}*/
table.quote tr.first td {
	background: -webkit-linear-gradient(top, #555555, #111111, #111111);   /*#555555, #FFFFFF*/
	background: -moz-linear-gradient(top, #555555, #111111, #111111); 
	 
}

table.quote tr.last td {
	background: -webkit-linear-gradient(bottom, #555555, #111111, #111111);   /*#555555, #FFFFFF*/
	background: -moz-linear-gradient(bottom, #555555, #111111, #111111); 
}

table.quote tbody td.C {text-align: center;}
table.quote tbody td.L {text-align: left;}
table.quote tbody td.R {text-align: right;}

/*報價字體調大	table.quote tbody td.bid, table.quote tbody td.ask {font-size: 19px;}*/ 

table.quote tbody td.bid, 
table.quote tbody td.lose {
	color: #00B800; /* 1ADB1A, color: #00B800;*/ 
	font-weight: bold;
	font-size:19px;
}
table.quote tbody td.ask, 
table.quote tbody td.gain {
	color: #FF5566; /*FF6666 color:FF668C #FF5566;*/
	font-weight: bold;
	font-size:19px;
}
 

.bid, .lose {color: #00B800; font-weight: bold; font-size:19px;}
.ask, .gain {color: #FF5566; font-weight: bold; font-size:19px;}
.mid, .cp {color: #fff;}


/* 奇偶數行 bg
table.quote tbody tr.odd {background-color: #111111;}
table.quote tbody tr.odd td.bid, table.quote tbody tr.odd td.lose {color: #00B800;}	//66FF33, 256E13
table.quote tbody tr.odd td.ask, table.quote tbody tr.odd td.gain {color: #FF5566;}

*/

table.quote td.item { } /*  font-weight: bold; font-size: 17px; */ 
table.quote td.item-s {font-size: 16px;}
table.quote .time {color:#DDDD88; font-size: 15px; } /*#CC3300*/
table.quote .time.warn {color:#FF5566;}  /* 2016.05 有警示色的 日期*/

table.quote td.spread {font-size: 17px;}

table.quote .active {font-weight:bold;}


/*			自選匯率  table.quote	*/
table.quote th.apparent {
	color:#DAA520;    /*自選匯率  橘黃色看起來太亂 #daa520*/ 
}

table.quote thead th {
	border-bottom: 1px solid #DAA520; 
}


table.quote div.spread {
	color: #999999;
	font-size: 15px;		
}


/* 自選內的 即期/現鈔 區分色 */
table.quote .spot {color:#FF7785; display:inline; font-size: 16px;}
table.quote .cash {color:#A6E6A6; display:inline; font-size: 16px;}




.quote-scroll {
	width: 100%;
	margin: 5px auto;
	border: 0px solid #FF0000;
	overflow-y: scroll; 
	min-height: 100px;
	/*max-height: 250px;*/
}
			
.quote-scroll .ceiling{
   	background: -webkit-linear-gradient(top, #FF0000, #FFFFFF);   /*#555555, #FFFFFF*/
	background: -moz-linear-gradient(top, #FF0000, #FFFFFF); 
	 width: 100%;
	 height: 4px;
	 opacity: 0;
}
.quote-scroll .floor{
	 /* background: linear-gradient(#FF0000, #555555) repeat scroll 0 0 #CCCCCC;	#006699*/
	/* background-color: #006699;*/
	background: -webkit-linear-gradient(top, #FFFFFF,  #FF0000 );   /* #FFFFFF,  #555555,, #1a82f7, #2F2727*/
	background: -moz-linear-gradient(top, #FFFFFF, #FF0000); 
	width: 100%;
	height: 4px;
	opacity: 0;
}


/***	歷史走勢 & 當日走勢 chart		***/
.page.chart .infoline {padding: 5px 0; margin-top: 5px; margin-bottom: 0px;}
.page.chart .tickLabel { font-size: 12pt; color: #eeeeee;}
.page.chart .infoline .time {	font-size: 16px; }
.page.chart .subtitle {color: #FFFFFF; text-align:center;  font-size: 17px; font-weight: bold; }

.page.chart .time {
	color: #DDDD88;  /*時間 span*/
}

/*歷史走勢圖 - 天期區的外框
.page.chart .periodZone {
	margin-top:3px; margin-bottom:15px;
	padding-top: 8px; 
	background-color:#2a2a2a;
	border:#333333 solid 1px; 
	border-radius:5px;
	text-align: center;
} 
.page.chart .periodZone label{
	font-size: 18px;
	font-weight: normal; 
}
.page.chart .periodZone label.on{
	font-size: 18px;
	font-weight: bold; 
	color: #FFD700; 
}
*/

 
/* 歷史匯率,  1m, .., 3y 的水平捲動 區塊
.page.chart .hscrollPeriodZone {
	width: 100%;
	height: 40px;
	padding: 0;	
	position:relative;
	overflow-x: auto;
	overflow-y: hidden; 
	border-top: 1px solid #555;
	border-bottom: 1px solid #555;
	background:#222;
	margin-bottom: 7px; 
	
}

.page.chart .hscrollPeriodZone .hscrollInner {
	position: absolute;
	****width: 99%;***
	text-align:center;
	min-width:320px;
	text-align: center; 
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 6px 5px;	
	background-color: #222;
	text-align:center;
}
*/
/*歷史匯率,  1m, .., 3y 的水平捲動 區塊
 mimic radio group (ex. quote type: 即期/現鈔, 以省空間)
*/
.page.chart .periodZone, .page .mimic-rdos {
	width: 100%; 
	text-align:center;
	background-color: #222;
	overflow-x: auto;
	padding: 5px 0; 
	margin-top: 8px;
	margin-bottom: 0px;
}
.page.chart .periodZone span, .page .mimic-rdos span {color:#aaa; padding: 0 8px;  cursor: pointer;}
.page.chart .periodZone span.on, .page .mimic-rdos span.on {color:#00ccff; font-weight:bold; font-size: 20px;}

/*
.ma0 {color: #FFCC00;}
.usd {color: #00B800;}
*/
 
.time { color: #DDDD88; font-size: 15px;}

.ma1 {color: #0099CC;}
.ma2 {color: #FF9900;}

/* 歷史圖 & 當日走勢圖 ::  買價/ 賣價/ 中價的 tab 切換  */
ul.bidAskType { 
	margin: 0;
	padding: 0;
	overflow: hidden;
}
ul.bidAskType  li { 
	display: inline-block;
	margin: 5px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 33.3%;
	text-align: center;
	/*color: white;*/
	/*background-color: #333;*/
	/*border: 2px solid #222;*/ 
	line-height: 28px;
}

ul.bidAskType li.on {
	font-weight: normal;
	/*background-color: #333;*/ 
}
ul.bidAskType li div { border-bottom: 2px solid #333; width:94%;}
ul.bidAskType li.bid.on div {border-bottom: 2px solid #00b800;}
ul.bidAskType li.ask.on div {border-bottom: 2px solid #f56; }
ul.bidAskType li.mid.on div {border-bottom: 2px solid #FFF; }

/* 合併買賣價 
ul.bidAskType li.on div {
	color:#daa520; 
	border-bottom: 2px solid #daa520; 
}
*/

.ps {text-align: left;}

/* 註解功能 的 UL / LI  */
ul.ps {
	list-style-type: circle;
	margin-left: 25px; 
}

ul.ps li {
	margin-top: 3px; 
	font-size: 15px;
}


/* more apps */
.more-app {font-size:17px; margin:5px 3px 15px 3px;}
.app-icon {float:left; margin:3px 7px 0px 3px;}
.app-title {display:block; margin-top: 3px; margin-bottom: 5px; color:#FFD700; font-size:20px; font-weight: bolder;}
.to-download {color:#FF5555; font-size: 18px;} 
 
 
.warn{color: #FF5566;} 

label.error {display: none; color: red; font-weight: bold;}

/* watch list */
hr.sep{margin:15px 10px; border: 2px dotted #336699;}
hr.sep-main{margin:10px 1px; border: 2px solid #003366;}



/* 新聞 **********************/
 .news {text-align:left; }
.news a {
	color: #EEE;
	border-bottom: 1px solid #444444;
	display: block;
	padding: 3px 3px 0px 5px;
	text-decoration: none; 
}

.news a .news_title {
	color: #DDDD88;
	font-weight: normal;
	margin: 15px 0px 3px 0px;
	line-height: 1.1em;
	overflow: hidden;
	text-shadow: 0px 0 0 #DDD;
}


.news a.first .news_title { margin: 15px 0px 3px 0px; }

.news .news_time{ font-weight: normal; font-size: 14px; color: #aaa; }

/*當日新進 的新聞*/
.news a.fresh .news_title { color: #DDDD88;}
/*已點過的 新聞*/
.news a.visited .news_title { color: #AAA;	font-size: 14px;}
.news a.visited .news_time {font-size: 12px;}



/* 2017.03.12 到價通知改用 UL / LI

ul.alarmList li { list-style-type:none; 
	margin:15px 5px 10px 5px; 
	 padding-bottom: 3px; 
	 border-bottom: 1px solid #CCC;
}

ul.alarmList LI.inactive { color: #999;} 
ul.alarmList LI.inactive span { color: #999;}

ul.alarmList.sorting LI { width:80%;}

ul.alarmList LI .clsSn{ color: #666; }
ul.alarmList li.last-one {border-bottom: 0; padding-bottom: 0px;}
ul.alarmList LI:last-child {border-bottom: 0; padding-bottom: 0px;}

ul.alarmList .status { font-size: 13px;}
ul.alarmList .status.monitor { color: #fff; }

ul.alarmList .diff-gain {color: #f5adad; font-weight: bold; font-size: 16px;}
ul.alarmList .diff-loss {color: #a6e6a6; font-weight: bold; font-size: 16px;}
*/

/***** 到價通知 -  調整順序  *****/
.page.mod-order .clsAlarmList { list-style-type: none; margin: 0; padding: 0; }
.page.mod-order .clsAlarmList li { 
	width:100%; 
	margin: 0 3px 5px 3px; 
	padding: 0.5em 0 0.5em 1.5em;
}
.page.mod-order .clsAlarmList li span { position: absolute; margin-left: -1.3em; }
.page.mod-order .clsAlarmList .ui-state-default {
	background: #181818; 
	border: 1px solid #444;
	color: #FFFFFF;
	font-weight:normal;
	font-size: 17px; 
}

.page.mod-order .clsAlarmList .status { font-size: 15px; color:#ccc;}
.page.mod-order .clsAlarmList .inactive { color: #999; }
.page.mod-order .clsAlarmList .inactive label { color: #999; }




.highlight { color:#FFD700;  font-weight: normal;}

.sub-title {display:block; margin-top: 10px; margin-bottom: 5px; color:#FFD700; font-size:17px; font-weight: normal;}


/*比較名次 FF5533 + FF0000,  FF9900, 66CCFF*/
.rank_no1 {
	text-align:center;
	vertical-align :top;
	font-weight:bold; 
	font-size: 14px;
	padding: 0 3px;	
	margin: 0px;
	color:#FFFFFF;
	border:#FF0000 solid 1px;
	background-color: #FF0000;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.rank_no2 {
	text-align:center;
	vertical-align :top;
	font-weight: bold; 
	font-size: 14px;
	padding: 0 3px;
	margin: 0px;
	color:#FFFFFF;
	border:#FFFFFF solid 1px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.rank_no3 {
	text-align:center;
	vertical-align: top;
	font-weight:bold; 
	font-size: 13px;
	padding: 0 3px;	
	margin: 0px;
	color:#FFFFFF;
	border:#FFFFFF solid 1px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}


/*to fix problem with input type=number with a step property while usign Chrome browser 
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
*/





/* 自選, 不再用table,  改用DIV ********/
.clsWatchList { width: 100%; }
.clsWatchList .time {
	color: #dd8;
	font-size: 14px;
}
		 
/*vertical align*/
.clsWatchList .bid.tpadding4valign, 
.clsWatchList .ask.tpadding4valign, 
.clsWatchList .mid.tpadding4valign, 
.clsWatchList .spread.tpadding4valign { vertical-align:top; padding-top:8px;}

.clsWatchListColTitle { 
	width: 100%; color:#eee;
	font-size: 15px; 
	font-weight: normal;
	margin-top: 0;
	padding: 5px 0;
	background-color: #222; 
	border-bottom: 1px #666 solid; 
}

/* Head 各欄寬度 要跟 body的一致	*/
.clsWatchListColTitle div { display:inline-block; text-align:center; margin:0; padding:0;	font-size: 16px;}
.clsWatchListColTitle div:nth-child(1){ width:32%;}	
.clsWatchListColTitle div:nth-child(2){ width:24%;}
.clsWatchListColTitle div:nth-child(3){ width:24%;}
.clsWatchListColTitle div:nth-child(4){ width:16%;}

.clsWatchList .clsHead {
	width: 70%;
	color:#eee ;  
	/*font-size: 15px;*/
	font-weight:  normal; 
	margin: 20px 15% 3px 15%;
	text-align: center; 
	padding: 4px;
	border-bottom: 1px solid #daa520;
}
.clsWatchList .clsHead.first-head {	 margin-top: 8px; }
.clsWatchList .clsHead.oth-head { 	}

.clsWatchList .clsHead .apparent { font-weight: bold; color: #daa520; }
.clsWatchList .clsHead div { display:inline-block; text-align:center; margin:0; padding:0; }
		
		
/*.clsHead .L {text-align:left; }*/

.clsWatchList .clsBody  { 
	/*background-color: #ff7785;*/ 
	width: 100%;
	margin-bottom: 10px; 
	padding: 5px 0 2px 0; 
	border-bottom: 1px solid #666;
}

.clsWatchList .clsBody > div { display:inline-block; text-align:center; margin:0; padding:0;}
.clsWatchList .clsBody > div:nth-child(1){ width:29%;}
.clsWatchList .clsBody > div:nth-child(2){ width:24%;}
.clsWatchList .clsBody > div:nth-child(3){ width:24%;}
.clsWatchList .clsBody > div:nth-child(4){ width:17%;}
.clsWatchList .clsBody .active { font-weight: bold; }
.clsWatchList .clsBody > .L {text-align:left; }

div.L {
	text-align: left;
}

.clsWatchList div.clsAlarm { 
	color: #ccc; 
	width: 96%; 
	margin: 0 2%; 
	/*border: 1px dashed #555; 
	border-radius: 4px;*/ 
	text-align: center; 
	font-weight:normal; 
	font-size: 17px;
	border-top: 1px dashed #555; 
}

.clsWatchList div.clsAlarm div.condi {
	/* 2017.03.31 改成各自獨立一列 :: 不要 display: inline-block; 
		width: 47%;  
		float: left;
	*/
	width: 100%;
	text-align: left; 
	background-color: #222;
	margin: 2px 0;
	padding: 5px 3px 5px 13px; 
	border-radius: 8px;
}

.clsWatchList .clsAlarm .bid { font-size: 18px; color: #00b800; font-weight: bold;}	/*border-color: #00b800;*/ 
.clsWatchList .clsAlarm .ask { font-size: 18px; color: #f56;	font-weight: bold;}		/*border-color: #f56;*/
.clsWatchList .clsAlarm .largerLess { font-size: 18px; font-weight:bold;}
/*.clsWatchList .clsAlarm ul li:last-child { border-bottom: 0; }*/
.clsWatchList .item { 
	/* color:#daa520; 
	font-size:17px;*/
}
.clsWatchList .spread {  font-size: 17px;}
/*.spot {color: #ff7785; font-size: 16px;}
.cash {color: #a6e6a6; font-size: 16px;}*/
		
.clsWatchList .spot {color: #f5adad; font-size: 16px;}
.clsWatchList .cash {color: #a6e6a6; font-size: 16px;} 
.clsWatchList .inactive { color: #aaa;}


/*計算機 */
#popupCalculator input[type=number] {
	width:100px; 
}
#popupCalculator .calItem {
	margin-top: 4px; 
	margin-bottom:8px; 
}

#popupQuoteCtxMenu .ctxmenu A{
	border-bottom: 0; 
}

#popupCalculator span.result {
	color: #DAA520;
	font-weight: bold; 
	font-size: 18px; 
}




