/*
 For CN portal pages (previously developed from Chs)
*/

/* Common */
.colorRow{background:#f4f7fd;}
.alignRight{text-align: right;}

.STButton{background:url(../images/st.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.noSTButton{background:url(../images/non-st.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.noStarSTButton{background:url(../images/non-starSt.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.StarSTButton{background:url(../images/starSt.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.HButton{background:url(../images/hshare.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.noHButton{background:url(../images/non-hshare.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.eligibleStockButton{background:url(../images/eligible.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.noeligibleStockButton{background:url(../images/non-eligible.png) no-repeat 0 0;background-size:contain;right:0;padding:0 1px 15px 15px}
.dataTables_wrapper .dtable{width:100%}
#searchStockButton{background-attachment:scroll;background-clip:border-box;background-color:#f6f4f4;background-origin:padding-box;background-size:auto;border-bottom-left-radius:0;border-bottom-right-radius:0;border-collapse:collapse;border-image-outset:0;border-image-repeat:stretch;border-image-slice:100%;border-image-source:none;border-image-width:1;border-top-left-radius:0;border-top-right-radius:0;color:#555;cursor:pointer;display:inline-block;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-stretch:normal;font-style:normal;font-variant:normal;font-weight:400;height:25.5938px;line-height:normal;list-style-image:none;list-style-position:outside;list-style-type:none;margin-right:1.2px;overflow-x:visible;overflow-y:visible;position:relative;text-align:center;text-decoration:none;width:63px;zoom:1;border-color:#fff;border-style:solid;border-width:1px;padding:0}
.cnPortal .lastUpdateTimeString{text-align: right; padding-top:10px;padding-right:3px;font-family:cursive;}
/* tab style */
#outerTabs #innerTabs0 .ui-tabs-nav li a,#outerTabs #innerTabs0 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs1 .ui-tabs-nav li a,#outerTabs #innerTabs1 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs2 .ui-tabs-nav li a,
#outerTabs #innerTabs0 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs0 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs0 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs #innerTabs1 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs1 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs1 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs #innerTabs2 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs2 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs2 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs
#outerTabs #innerTabs .ui-widget-header li{float:left}
#outerTabs .outerTabsContent{}
#outerTabs #innerTabs0 .ui-tabs-nav li,#outerTabs #innerTabs1 .ui-tabs-nav li,#outerTabs #innerTabs2 .ui-tabs-nav li,#outerTabs #innerTabs3 .ui-tabs-nav li{width:initial;float:left}
#outerTabs #innerTabs0 .ui-tabs-nav li a,#outerTabs #innerTabs0 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs1 .ui-tabs-nav li a,#outerTabs #innerTabs1 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs2 .ui-tabs-nav li a,#outerTabs #innerTabs2 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs3 .ui-tabs-nav li a,#outerTabs #innerTabs3 .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a{
    background: #fff 50% 50% repeat-x;
    font-weight: bold;
    color: #484848;}
#outerTabs #innerTabs0 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs0 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs0 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs #innerTabs1 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs1 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs1 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs #innerTabs2 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs2 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs2 .ui-tabs .ui-tabs-nav li.ui-state-processing a,#outerTabs #innerTabs3 .ui-tabs-nav li.ui-tabs-selected a,#outerTabs #innerTabs3 .ui-tabs .ui-tabs-nav li.ui-state-disabled a,#outerTabs #innerTabs3 .ui-tabs .ui-tabs-nav li.ui-state-processing a{ border-width: 0;
    background: #17559e 50% 50% repeat-x;
    font-weight: bold;
    color: #fff;}
#outerTabs #innerTabs .ui-widget-header li{width:initial;float:left}
.ui-corner-top {
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    -moz-border-radius-topright: 4px;
    -webkit-border-top-right-radius: 4px;
    border-top-right-radius: 4px;
}
.dataTables_wrapper .dtable tr:nth-child(even){
    background: #f4f7fd;
}

.investTradeWrapper .ui-widget-content{
    border: 0px;
}

.investTradeWrapper .ui-tabs .ui-tabs-nav li{padding: 1px; padding-right:2px; margin-bottom: 0px; border:0px}
.investTradeWrapper .ui-tabs .ui-tabs-panel {padding: 0px}
/*
 * CnMostActive 
 */
.cnMostActiveTbody .propertyValue{text-align:right;padding-right:17px}
.cnMostActiveheader tr td{text-align:center;padding:4px 0}
.cnMostActiveTable{width:100%}
.cnMostActiveTbody tr{text-align:center}
.cnMostActiveTbody tr td{padding:4px 0}
#cnMostActiveWrapper{min-width:100%}
#cnMostActiveWrapper .ui-widget-content{border:0; padding: 3px; width: initial}
#cnMostActiveWrapper #outerTabs .ui-widget-header{border:0}
#cnMostActiveWrapper #outerTabs .ui-widget-header li, #cnMostActiveWrapper #outerTabs .ui-state-hover a{background:#FFF; border: 0px; line-height:22px;}
#cnMostActiveWrapper #outerTabs ui-state-active a{background:#FFF; border: 0px; color:#d11515}
#cnMostActiveWrapper .innerTabsClass{overflow-x:auto}
    /* Main Color */
    .cnMostActiveheader tr{background-color: #1a5db0;border-top: 2px solid #AAA;border-bottom: 1px solid #AAA;color: #FFF;font-size:13px}
    #cnMostActiveWrapper .ui-state-active a, #cnMostActiveWrapper .ui-state-active a:link, #cnMostActiveWrapper .ui-state-active a:hover{color: #1a5db0}
    #cnMostActiveWrapper .ui-state-default:not(.ui-tabs-selected) a:hover{color: #000000; font-weight: bold}
    #cnMostActiveWrapper .ui-state-default a{color:#555555}

/* News */
#newsWrapper{min-width:600px;position:relative}

/* Quote */
#cnQuoteWrapper .errMsg1{color:#09F;position:absolute;padding-left:78px;line-height:23px}
#cnQuoteWrapper #topStockCodeBar{width:100%;background-color:#666;color:#FFF}
#cnQuoteWrapper .quoteTitle{border-top:2px solid;border-bottom:2px solid;height:70px}
#cnQuoteWrapper .quoteTitle div{height:20px;padding-top:2px}
#cnQuoteWrapper .quoteTitle .stockName{font-size:22px;font-weight:700}
#cnQuoteWrapper .quoteTitle div .price{font-size:34px;font-weight:700;padding-right:10px}
#cnQuoteWrapper .quoteTitle div .upPercentage{font-size:18px;font-weight:700;color:green}
#cnQuoteWrapper .quoteTitle div .downPercentage{font-size:18px;font-weight:700;color:red}
#cnQuoteWrapper .quoteTitle .quoteTitleRightAlign{position:relative;height:30px;float:right}
#cnQuoteWrapper .quoteTitle .quoteTitleRightAlign .quoteTitleBottomAlign span{background-size:20px 20px;padding:0 1px 22px 22px;bottom:0}
#cnQuoteWrapper .quoteBody .cnQuoteBodyContent{width:150px;padding-top:5px;padding-right:20px;vertical-align:top}
#cnQuoteWrapper .quoteBody .cnQuoteBodyContent table{height:100%}
#cnQuoteWrapper .quoteBody .cnQuoteBodyContent table tr td{height:21px;border-bottom:1px solid #DDD}
#cnQuoteWrapper .quoteBody .cnQuoteBodyContent table tr .property{width:100%;font-family: serif;}
#cnQuoteWrapper .quoteBody .cnQuoteBodyContent .alignRightValue{text-align:right}
#cnQuoteWrapper .quoteTitle div .upLogo{background:url(../images/percentage-up.png) no-repeat 2% 50%;background-size:16px 16px;padding:7px 4px 4px 16px}
#cnQuoteWrapper .quoteTitle div .downLogo{background:url(../images/percentage-down.png) no-repeat 0 0;background-size:16px 16px;padding:7px 4px 4px 16px}
#cnQuoteWrapper .pagingMsg{color:#FFF}
#cnQuoteWrapper #quoteChartWrapper #quoteChartTabs{background-size:20px 20px;padding:0 2px 12px 22px;position:relative;bottom:0;background:#FFF;width:502px}
#cnQuoteWrapper #quoteChartWrapper #quoteChartTabs{background-size:20px 20px;padding:0 2px 12px 22px;position:relative;bottom:0;background:#FFF;width:602px}
#cnQuoteWrapper .stockCode{padding:3px 8px 2px!important;font-size:10px!important;background-color:#FFF;font-weight:700;color:#888;border:1px solid #AAA;width:70px;float:left}
#cnQuoteWrapper #getStockCode{padding-left:5px;width:130px}
#cnQuoteWrapper .titleCode{padding-right:10px;font-size:20px}
#cnQuoteWrapper .ui-tabs .ui-tabs-nav li a{float: left;
    padding: 3px 1em;
    text-decoration: none;}
#quoteChartWrapper{width:495px;position:relative}
#quoteChartTabs{padding-bottom:0;border:1px #DDD solid}
#quoteChartTabs .ui-tabs-nav{background:transparent;border:0;padding:0}
#quoteChartTabs .ui-tabs-nav li{background:#FFF;margin:0 .1em;border-top-left-radius:0;border-top-right-radius:0}
#quoteChartTabs .ui-tabs-nav li a{color:#000;padding:3px 18px}
#quoteChartTabs .ui-tabs-nav li.ui-tabs-selected a,#quoteChartTabs .ui-tabs-nav li.ui-state-disabled a,#quoteChartTabs .ui-tabs-nav li.ui-state-processing a{color:#FFF}
#quoteChartTabs .ui-tabs-nav li.ui-tabs-selected,#quoteChartTabs .ui-tabs-nav li.ui-state-disabled,#quoteChartTabs .ui-tabs-nav li.ui-state-processing{background:#C8D6FF}

/* CompanyInfo */
#tabCompanyInfoWrapper{width:100%}
#tabCompanyInfoWrapper .stockNameTable{background-color:#1A5DB0;width:100%}
#tabCompanyInfoWrapper .stockNameTable .header{font-weight:700;color:#FFF;font-size:16px;background-color:#373855;padding:3px 0 3px 5px}
#tabCompanyInfoWrapper .companyInfoTable .propertyName{height:20px;color:#0085c6;font-weight:700;width:20%}
#cnCompanyInfo #tabCompanyInfoWrapper .subtitles {background: #c0c0c0!important;color: #222;font-weight: bold;font-size: 14px;padding-bottom: 3px;padding-left: 5px;padding-right: 0;padding-top: 3px;}
/* eligible */
#eligibleListWrapper{min-width:100%;width:100%}
#eligibleListWrapper .rightSpacing{padding-right:25px}
#eligibleListWrapper .dtable tbody tr td.rightSpacing{padding-right:36px}
#eligibleListWrapper .leftSpacing{padding-left:63px}
#eligibleListWrapper .dtable tbody tr td{padding:3px 0}

/* ahQuote */
#ahQuoteWrapper .dataTables_wrapper .dtable th{border:0;background-color:#17559e}
#ahQuoteWrapper .thead{font-size:80%}
#ahQuoteWrapper .dtable tbody tr td{padding:5px 0}
#ahQuoteWrapper .dtable tbody tr .rightSpacing{padding-right:13px}
#ahQuoteWrapper .pagingMsg{color:#000}
#ahQuoteWrapper .leftRightBorder{border-left:1px solid grey}

/* Sector */
#sectorListWrapper .rightSpacing{padding-right:13px}
#sectorListWrapper .dataTables_wrapper .dtable th{border:0;border-bottom:1px solid #AAA;background-color:#1a5db0;background-image:none;text-align:center}

/* Ipo */
#shIpoWrapper .dataTables_wrapper .dtable th{border:0;background-color:#1a5db0;background-image:none;text-align:center}

/* constituent */
#cnConstituentWrapper{width:100%}
#cnConstituentWrapper .tableTitle{background:silver!important;color:#222;font-weight:700;font-size:14px;padding:3px 0 3px 5px}
#cnConstituentWrapper .cnConstituentListTable{height:25px}
#cnConstituentWrapper .dataTables_wrapper .dtable th{border:0}
#cnConstituentWrapper {
	width: 100%;
}
#cnConstituentWrapper .topHeader {
	font-size: 24px;
	font-weight: bold;
	color: #000;
}
#cnConstituentWrapper .rtTable {
	width: 100%
}
#cnConstituentWrapper .rtTable tr {
	height: 30px;
	border: solid 1px #000;
}
#cnConstituentWrapper .rtTable td, #cnConstituentWrapper .rtTable th {
	padding: 0 10px;
}
#cnConstituentWrapper .rtTable .rtHeader {
	background-color: #17559e !important;
	color: #fff;
	font-weight: bold;
}		
#cnConstituentWrapper .rtTable .row1 {
	background-color: #fff;
}
#cnConstituentWrapper .rtTable .row2 {
	background-color: #D8D8D8;
}
.dailyQuotaBar {
    width: 200px;
    height: 20px;
    background: url(../images/dailyQuota.png) no-repeat 0 -72px;
}
.dailyQuotaBar .color1 {
	height: 20px;
	background: url(../images/dailyQuota.png) no-repeat 0 0;
}
.dailyQuotaBar .color2 {
	height: 20px;
	background: url(../images/dailyQuota.png) no-repeat 0 -24px;
}
.dailyQuotaBar .color3 {
	height: 20px;
	background: url(../images/dailyQuota.png) no-repeat 0 -48px;
}

/* CompanyInfo */
.prelogon #cnCompanyInfo{width:100%}
.postlogon #cnCompanyInfo{width:100%}
/*#cnCompanyInfo .cnCompanyInfoSubtitle{background:#888 url(images/ui-bg_highlight-soft_15_888888_1x100.png) 50% 50% repeat-x;padding:4px 10px;color:#FFF;font-weight:700;font-size:14px;border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}*/
#cnCompanyInfo .cnCompanyInfoSubtitle{padding:4px 0px;font-weight:700;font-size:14px;border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}
#cnCompanyInfo .tableTitle{background:silver!important;color:#222;font-weight:700;font-size:14px;padding:3px 0 3px 5px}
#cnCompanyInfo .whiteRow{background-color:#FFF}
#tabCompanyInfoWrapper .companyInfoTable{width:100%}
#cnCompanyInfo .ui-tabs .ui-tabs-nav{margin:0;padding:2px 2px 0 0}
#companyInfoWrapper{min-width:666px;width:664px;position:relative}
#companyInfoWrapper .stockNameTable{background-color:#1A5DB0;width:100%}
#companyInfoWrapper .stockNameTable .header{font-weight:700;color:#FFF;font-size:16px;background-color:#1A5DB0;padding:3px 0 3px 5px}
#companyInfoWrapper .companyInfoTable{width:100%}
#companyInfoWrapper .companyInfoTable .companyInfoTableBody .blueRow{background-color:#F4F7FD}
#companyInfoWrapper .companyInfoTable .companyInfoTableBody tr td{padding:5px 0}
#companyInfoWrapper .companyInfoTable .companyInfoTableBody .propertyName{height:20px;color:#0085c6;font-weight:700;width:20%}
#tabCompanyInfoWrapper .subSubtitles{font-weight:700;text-align:center;background-color:#FDB;border:0}

/* sector */
#sectorListWrapper{min-width:100%;width:100%}
#sectorListWrapper .sectorListTable{height:25px}
#sectorListWrapper .sectorOptionSelect{font-size:12px;margin: 5px 3px 0px 4px;height:22px}
.dataTables_wrapper td.rightSpacing{padding-right:30px}

/* shIpo */
#shIpoWrapper{min-width:100%;width:100%}
#shIpoWrapper .shIpoEven{background-color:#F4F6D9}
#shIpoWrapper .shIpoOdd{background-color:#FFF}
#shIpoWrapper .rightSpacing{padding-right:10px}
#shIpoWrapper .sectorTitle{font-weight:700;font-style:italic;font-size:12px}
#shIpoWrapper .dtableTitle{text-align:center;font-weight:700;background-color:#EEE;line-height:21px;font-size:15px;border:1px solid #999;margin-bottom:5px}
#shIpoWrapper .rightTable{border:1px solid #DDD;padding:12px 3px}
#shIpoWrapper .rightTable .rightTableWrapper{overflow-x:auto;height:100%}
.hideLongWords{text-overflow:ellipsis;overflow:hidden}