/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public dodiv id="main")
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, img, ins, kbd, q, s, samp,
small, strike, sub, tt, var,
b, u, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}

ul{
    list-style:none;
    padding-left: 25px;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a{
    text-decoration: none;
    color:#f4911e;
}

img{
	border:0;
}

body{
    font: 12px Arial, Helvetica, sans-serif;
    width:100%;
    background: #FFFFFF;
    min-width:1200px !important;
    height:100%;
    color:#4d4d4f;
	overflow: visible !important;
}

p{
    line-height:18px;
    padding-bottom:10px;
}

h2{
    font-size:32px;
	padding-bottom:20px;
	color:#f4911e;
	font-family: Arial, Helvetica, sans-serif
}

h3{
    font:24px/32px Arial, Helvetica, sans-serif;
    color:#f4911e;
}

h4{
    font:20px/24px Arial, Helvetica, sans-serif;
    color:#f4911e;
}

h5{
    font:16px/20px Arial, Helvetica, sans-serif;
    color:#f4911e;
}

/**header**/
#header{
    background:url(../images/bg_header.png) repeat-x top left;
	height: 163px;
	width:100%;
}

#header .logo{
    padding: 0 10px;
    margin: 0 auto;
    width:960px;
	height:122px;
}

#header .logo a{
	width:510px;
	float:left;
	padding-top: 40px;
}

.m1-SGX{
	width:210px;
	float:right;
	padding-top:32px;
}

.m1-SGX .m1-SGX-header{
	color: #585858;
	font-size: 14px;
	font-weight: bold;
	border-bottom: 3px solid #d6d6d6;
	padding-bottom: 5px;
}

.m1-SGX .m1-SGX-number{
	color: #474747;
	padding:3px 0 0px;
	font-size:14px;
}

.m1-SGX .last-updated-SGX, .m1-SGX .volume-SGX, .m1-SGX .totalVolume-SGX,
.m1-SGX .small-text{
	color:#949494;
	padding-bottom:5px;
	font-size:10px;
}

#header #nav{
    height: 36px;
	width:100%;
	padding-top:0;
}
#nav > ul{
    width: 960px;
    min-width:320px;
    margin:0 auto;
    padding-left:0;
}

#nav ul li{
    display:inline-block;
/*    float:left; */
}

#nav ul li a{
    color: #FFF;
    font-size:12px;
    display:block;
    padding: 12px 18px 11px 17px;
   /* border:1px solid red;*/
}

.ie #nav ul li a{
	padding: 12px 17px 12px 17px;
}

#nav > ul > li:hover > a{
	background: #f1f1f1;
	color: #f4911e;
}

#nav ul > li ul.sub-menu {
   	background: none repeat scroll 0 0 #f1f1f1;
	border-top:1px solid #FFF;
    display: none;
    padding-left: 0;
    position: absolute;
    width: 202px;
    z-index: 99;
}

#nav ul > li:hover ul.sub-menu{
    padding-left:0;
    
}

#nav ul > li ul.sub-menu li{
    padding-left:5px;
    padding-right:5px;
    border-bottom:1px solid #FFF;
	width: 192px;
}

.sub-menu li:last-child{
	border-bottom:none;
}

.sub-menu li:hover{
   background: #ec8b1a;
}

#nav > ul > li > ul.sub-menu li > a{
    color: #3a3a3a;
	padding-left: 14px !important;
	padding-right:14px;
}

.mobile #nav > ul > li:hover > ul.sub-menu {
    display:block;
}

#nav > ul > li > ul.sub-menu > li > a:hover{
    color: #FFF;
}

/** Common **/
.justify{
    text-align:justify !important;
}
.right{
    text-align:right !important;
}
.center{
    text-align:center;
}
.orange{
    color:#f4911e !important;
}
.gray{
    color:#464646 !important;
}
.hide{
    display:none;
}
.floatLeft{
    float: left;
}

.floatRt{
    float:right;
}

.clearfix{
    clear: both;
}

.width-650{
    width:650px;
}
.border-bottom-dot{
    border-bottom:1px dotted #f4911e !important;
}

.border-solid-bottom{
	border-bottom:1px solid #f4911e;
}

.border-gray-bottom{
	border-bottom:1px solid #4d4d4f;
}

.border-bottom-solid{
    border-bottom:2px solid #f4911e;
}

.border-right-solid{
	border-right:1px solid #f4911e;
}

.border-none{
    border:none !important;
}
.col2 {
    padding-right: 20px;
    width: 220px;
}

.margin-none{
    margin:0 !important;
}

.padding-bottom-0{
    padding:0 !important;
}

.padding-none{
    padding:0 !important;
}

.padding-right-none{
    padding-right:0 !important;
}

.background-none{
    background:none !important;
}


/** Tables **/
.tables{
    padding-right:20px;
}

.tables table tr td{
    padding:5px 10px 5px 0;
}

.tables thead tr td{border-bottom:1px solid #f4911e;}
.tables table td{vertical-align:top;}

.defaultTable tr td:nth-child(2){
 	background: none repeat scroll 0 0 #DDDDDD;
    padding-right: 38px;
    width: 60px;
}

.tables table tr td.light-orange{
	background: #fff0e1;
}

.valign{
	vertical-align:bottom !important;
}

/** div id="main" Content **/
#index #main{
	padding:0;
}

#main{
	padding:50px 0;
}

.main-content{
    width:960px;
    margin:0 auto;
    font-family: Arial, Verdana, sans-serif;
	position:relative;
}

.aside{
	float: left;
	width:298px;
	padding-right:28px;
}

.aside h3{
	padding-bottom:32px;
}

.aside .total-dividend-payout h6{
	font-size:15px;
	padding-bottom:5px;
	font-weight:bold;
}

.total-dividend-payout .figure{
	font-size: 48px;
	line-height:30px;
	margin-top:12px;
}

.total-dividend-payout span{
	font-size:22px;
}

.total-dividend-payout small{
	font-size:12px;
	color:#4d4d4F;
}

.content-text{
	float:left;
	width:632px;
}

.main-content h6{
	font-size:16px;
	padding:24px 0 12px 0;
	font-weight:bold;
}

.col{
    width: 450px;
    padding: 10px 20px 10px 0px;
}

.col p{
    text-align:justify;
}

.main-content .content-text ul{
    line-height: 18px;
    padding-bottom:10px;
    list-style:disc;
}

.main-content .content-text ul ul{
	list-style:circle;
}

.main-content .sub-title{
	font-size: 18px;
	color: 4d4d4f;
}

.main-content h2{
	color: #4e4e4e;
	padding-bottom:45px;
}

.main-content ol{
	list-style-type: decimal;
	padding-left: 15px;
}

.main-content  ol li{
	color: #f4911e;
	font-weight: bold;
	padding-bottom:10px;
}

ol li p, .main-content ol li ul li,
.main-content  td, .main-content  ol li ol li{
	font-weight:normal;
	color: #4d4d4f;
}

.main-content ol li ul li{list-style:disc;}

.main-content ol.numerical{
	list-style-type:lower-roman;
}

.main-content ol.alpha{
	list-style-type:lower-alpha;
}

.main-content  ol.alpha li{
	font-weight: normal;
}

.tables ul{padding-left:16px;}
/** Chart **/
.chart{
	padding-top:25px;
}
.chart-div{
	position: relative;
	float: left;
	width: 450px;
	margin-right: 40px;
	margin-bottom:10px !important;
	height: 410px;
}

.col4{
	width: 200px;
	float: left;
	height: 400px;
	padding-right: 46px;
}

.chart h3{
   border-bottom: 1px dotted #f3901d;
    padding: 10px 0 5px 0px;
    font-size: 16px;
    color: #f3901d;
	font-weight:bold;
    line-height: 17px;
}

.chart .col4.specail h3{
	height: 15px;
	display: block;
	padding-top: 30px;
}

.chart h3 span.gray-text{
	font-size: 15px;
	color: #4d4d4f;
}

.gray-text{
	color:#4d4d4f;
}

.chart h2 small{
    color:#222;
    font-size:12px;
    border-bottom: 1px dotted #fff0e1;
}

.chart .legend ul li{
    list-style: none;
    font-weight:bold;
    padding: 5px 0 0 35px;
}

.chart .legend {
    padding-top:10px;
}

.m1Orange {
    background:  url('../images/bg_orange.jpg') no-repeat 0 5px;
}
.m1OrangeLine {
    background:  url('../images/bg_orangeLine.jpg') no-repeat 0 5px;
}

.m1Gray {
    background: url('../images/bg_gray.jpg') no-repeat 0 5px;
}
.m1DarkGray {
    background: url('../images/bg_darkgray.jpg') no-repeat 0 5px;
}

#ebitda1, #net-profit-after-tax1{
    height: 80px;
    position: absolute;
    top: 50px;
    z-index: 9;
    width: 450px;
}

#ebitda2, #net-profit-after-tax{
    height: 250px;
    padding-top: 50px;
}

#cash-flow-capital-expenditure,
#earnings-free-cash-flow-share{
    height:300px;
}

.chart-div .img-customer-mix{
	position: absolute;
	top: 160px;
	left: 205px;
	z-index: 9;
	display:none;
}

.chart-div .img-revenue-mix{
	position: absolute;
	top: 158px;
	left: 212px;
	z-index: 9;
	display:none;
}

/**operating revenue mix**/
#cash-distribution-per-share1 .figure-label,
#cash-distribution-per-share2 .figure-label,
#capital-expenditure1 .figure-label,
#capital-expenditure2 .figure-label,
#net-debt1 .figure-label,
#net-debt2 .figure-label,
#mobile-data-service-revenue1 .figure-label,
#mobile-data-service-revenue2 .figure-label{
	font-weight: bold;
	font-family: Arial, Verdana, sans-serif;
	font-size: 14px;
	display: block;
}

#stack .figure-label,
#orsr .figure-label, #ebitda2 .figure-label,
#ebitda1 .figure-label,
#net-profit-after-tax1 .figure-label,
#net-profit-after-tax .figure-label,
#cash-flow-capital-expenditure .figure-label,
#earnings-free-cash-flow-share .figure-label{
    font-weight:bold;
    font-family: Arial, Verdana, sans-serif;
    /*font-size:0.9em;*/
}

#operating-revenue-mix{
	width: 640px;
	margin: 0px auto;
	height: 300px;
	padding-bottom: 20px;
	opacity:0;
}

#operating-revenue-mix .figure-label{
	color: #ffffff;
	font-family: Arial, Verdana, sans-serif;
	display: block;
	font-weight: bold;
	position: absolute;
}
#operating-revenue-mix .handset{
	font-size: 20px;
	top: 56px;
	left: 68px;
}

#operating-revenue-mix .services{
	top: 14px;
	left: 99px;
	font-size: 13px;
}

#operating-revenue-mix .international-call{
	top: -20px;
	left: 134px;
	color: #636466 !important;
	font-size: 16px;
}
#operating-revenue-mix .mobile-tele{
	top: -18px;
	left: -109px;
	font-size: 24px;
	color: #000 !important;
}

#mobile-customer-mix .figure-label, 
#mobile-telecommunications-revenue-mix .figure-label{
	font-size: 21px;
	font-weight: bold;
	padding-top: 6px;
	display: block;
	text-align: left;
	font-family: Arial, Verdana, sans-serif;
}
/*Business Review*/

#at-glance-1 .bcg {
    background-image:url('../images/img_ataglance.jpg');
    background-size: cover;
}

#at-glance-2 .bcg {
    background-color:#fff0e1;
    background-size:cover;
}

#at-glance-2 .hsContent {
    color: #ebebeb;
    text-align: left;
    max-width:960px;
    min-width:450px;
    width:100%;
    display:block;
    margin-top:0;
    
}

/**Shareholder**/
#signature{
    list-style:none;
	padding-left:0;
	float:left;
}

#signature li{
    float:left;
    padding-right:100px;
}
.ie #signature li.last{
    padding-top:89px !important;
}
#signature li:last-child, #signature li.last{
    padding-top: 89px !important;
}

#signature li:last-child, #signature li p{
    text-align:right;
}

#signature span{
    color:#4d4d4f;
}

/*Board of Directors*/
/*Board of Directors*/
.bod-item{
    display: inline-block;
	vertical-align: top;
	height: 295px;
	width: 202px;
	padding-right: 47px; 
}

.bod-item.active .expanded{
	z-index:9;
}
 
.sm .bod-item{
    height:325px;
}

.bod-item .bod-img{
    position:relative;
    height:227px;
    padding-bottom:10px;
	cursor:pointer;
	overflow:hidden;
}

.bod-item .bod-img img.show{
    opacity:0;
	 filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    height:0;
	padding-top:182px;
	border: 1px solid transparent;
	display:inline-block;
	
}
.bod-item .bod-img:hover img.show{
    opacity:1;
    height:auto;
    transition: opacity 0.5s ease-in ;
      -webkit-transition: opacity 0.5s ease-in;
      -moz-transition : opacity 0.5s ease-in;
      -o-transition : opacity 0.5s ease-in;  
}

.bod-img img{
    position:absolute;
    top:0;
    left:0;
	border:1px solid #ebebeb;
}

.bod-item .expanded{
    height: auto;
    position: absolute;
    padding: 20px 20px;
    overflow: hidden;
    opacity: 0;
	 filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    box-shadow: 0px 4px 10px #ebebeb;
    text-align: justify;
    width: 920px;
	left:0;
	border: 1px solid #ebebeb;
}


.bod-item.active > p{
    border-bottom:3px solid #f4911e;
}

/**Investors Relations**/
.notes{
    padding-top:10px;
}

.notes table{
    font-style:italic;
    font-size:9px;
    line-height:12px;
}
.notes p{
    font-size:9px;
    line-height:12px;
    
}
.notes p sup{
    display:inline-block;
    padding-right:10px;
}

/**Downloadds**/
.dl-item{
	padding:10px 0;
}

.dl-item .dl-name{
	float:left;
	width:640px;
	font-weight:bold;
}

.dl-item .dl-name span{
	font-weight:normal;
}

.dl-item .dl-link{
	float:right;
	width:300px;
	font-weight:bold;
	text-align:right;
}

/**Sticky Notes**/
#sticky-container{
	height:0;
	z-index:999;
    position:absolute;
}

#sticky-container #back-to-top{
	position: fixed;
	background: url('../images/back-top.png') no-repeat;
	width: 55px;
	height: 50px;
	text-indent: -99999px;
	bottom: 0;
	right: 0;
	display:none;
}

#sticky-container .page-navi .page-navi-wrapper{
	height: 142px;
	position: fixed;
	top:50%;
	cursor:pointer;
}
#sticky-container .page-navi a img{
	position:absolute;
	top:0;
}

#prev-wrapper{
	left:0;
}

#sticky-container .page-navi a{
	/*background: url(../images/bg-prev.png) no-repeat;*/
	position:relative;
}

#sticky-container .page-navi a#prev img{
	left:0;
}

#sticky-container .page-navi a#next img{
	right:0;
}

#next-wrapper{
	right:0;
}

#sticky-container .page-navi a#next{
	/*background: url(../images/bg-next.png) no-repeat;*/
}

.page-navi a span{
	top: 47px;
	text-indent: -9999;
	display: block;
	position: absolute;
	background: #FFF;
	width: 200px;
	font-weight: bold;
	/*border-bottom: 2px solid #f4911e;*/
}

.page-navi a#prev span{
	left: -240px;
	padding:10px 0 10px 50px !important;
	text-align:left;
}

.page-navi a#next span{
	right: -240px;
	padding:10px 50px 10px 0 !important;
	text-align:right;
}

.page-navi a span.two-line{
	top:42px;
}

#sticky-container .essential-tools{
    position: fixed;
	right: 8px;
	width: 24px;
	padding-left: 5px;
	top: 185px;

}

.essential-tools a{
	padding-bottom:4px; 
	display:block;
}
/**Footer**/

/**Carousel**/

#slides {
  width:1200px;
  height:741px !important;
  margin:-5px auto 0 auto;
}

#slides .relative-div{
	position:relative;
}

#slides .slider-item{

}

#slides div.text-item {
	position: absolute;
	top: 100px;
	right: 100px;
	width: 390px;
	height: 400px;
}

#slides div.text-item > img{
	width:auto !important;
	height: auto !important;
	top: 0 !important;
	left: 0 !important;
}

.slides-holder{
    position:absolute; 
    top:160px; 
    width:100%;
    z-index:-1; 
}

#slider-navi{
    width: 100px;
    margin: 0 auto;
    text-align: center;
    padding-top:10px;
}

#slider-navi a{
    background: url(../images/bullets.jpg);
    width: 9px;
    height: 12px;
    margin-right: 6px;
    text-indent: -9999px;
    display: inline-block;
}

#slider-navi a.activeSlide{
    background-position:12px 0;
    width:12px;
    height:12px;
}

/**QTip**/
/*
 * qTip2 - Pretty powerful tooltips - v2.2.0
 * http://qtip2.com
 *
 * Copyright (c) 2013 Craig Michael Thompson
 * Released under the MIT, GPL licenses
 * http://jquery.org/license
 *
 * Date: Thu Nov 21 2013 08:36 GMT+0000
 * Plugins: None
 * Styles: None
 */
.qtip{
	position: absolute;
	left: -28000px;
	top: -28000px;
	display: none;

	max-width: 280px;
	min-width: 50px;
	
	font-size: 10.5px;
	line-height: 12px;

	direction: ltr;

	box-shadow: none;
	padding: 0;
}

	.qtip-content{
		position: relative;
		padding: 3px 9px;
		overflow: hidden;

		text-align: left;
		word-wrap: break-word;
	}

/* Default tooltip style */
.qtip-default{
	border-width: 1px;
	border-style: solid;
	border-color: #d2d2d2;
	background-color: #FFF;
	color: #626b74;
}