@font-face {
    font-family: 'DIN_Regular';
    src: url('fonts/dinpro-regular-webfont.eot');
    src: url('fonts/dinpro-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/dinpro-regular-webfont.woff') format('woff'),
         url('fonts/dinpro-regular-webfont.ttf') format('truetype'),
         url('fonts/dinpro-regular-webfont.svg#dinpro-regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DIN_Bold';
    src: url('fonts/dinpro-bold-webfont.eot');
    src: url('fonts/dinpro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/dinpro-bold-webfont.woff') format('woff'),
         url('fonts/dinpro-bold-webfont.ttf') format('truetype'),
         url('fonts/dinpro-bold-webfont.svg#dinprobold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DIN_Black';
    src: url('fonts/dinpro-black-webfont.eot');
    src: url('fonts/dinpro-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/dinpro-black-webfont.woff') format('woff'),
         url('fonts/dinpro-black-webfont.ttf') format('truetype'),
         url('fonts/dinpro-black-webfont.svg#dinproblack') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DINCOND_Bold';
    src: url('fonts/DINConBol.eot');
    src: url('fonts/DINConBol.eot?#iefix') format('embedded-opentype'),
         url('fonts/DINConBol.woff') format('woff'),
         url('fonts/DINConBol.ttf') format('truetype'),
         url('fonts/DINConBol.svg#dincondbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DIN_1451_Std_Engschrift';
    src: url('fonts/dinengschriftstd-webfont.eot');
    src: url('fonts/dinengschriftstd-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/dinengschriftstd-webfont.woff') format('woff'),
         url('fonts/dinengschriftstd-webfont.ttf') format('truetype'),
         url('fonts/dinengschriftstd-webfont.svg#din_1451_stdengschrift') format('svg');
    font-weight: normal;
    font-style: normal;
}
/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */

main{ display: block;}

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, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, 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;
}
b, strong{ font-weight: 700;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
    color: #fff;
	font-family: 'DIN_Regular', Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a {
    color: #fff;
	text-decoration: none;
}
a:hover {
	color: inherit;
	text-decoration: underline;
}
.page-child-content-single a {
    color: #000;
}
strong {
    font-family: 'SamsungIF_Black', Helvetica, sans-serif;
}
.hiddenfix {
	display: none;
}
.section {
    margin-bottom: 10px;
}
.clearfix {
	zoom: 1;
}
.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}
div > img {
	vertical-align: top;
}
h1, h2, h3, h4, h5, h6, h7 {
	line-height: 1.33;
}
p, .paragraph {
	line-height: 1.2;
}
.title{ text-transform: uppercase; }
h1.titleannouncement {
    width: 100%;
    height: 50%;
    color: #005daa;
    font-family: 'DIN_1451_Std_Engschrift', Helvetica, sans-serif;
    font-size: 45px;
}

.page-info .desc, .desc p{
    font-size: 12px !important;
}

.tnb-red {
    /*color: #e44126;*/
    /*background-color: #fff;*/
    color: #FFF;
    /*margin: 0 5px;*/
    text-decoration: underline;
}

.goBackToOld{
    height: 40px;
    background-color: black;
    padding: 0 3.5%;
    font-weight: bold;   
}

.goBackToOld h4{
    padding-left: 7px;
    padding-top: 10px;
    font-size: 14px;
    font-family: 'DINCOND_Bold';
}

.contactCall {
    top: 26px;
    left: 3.5%;
    padding-left: 7px;
    position: absolute;
    font-size: 10px;
    cursor: pointer;
    display:none;
}
.contactCall2 {
    background-color: red;
    padding: 100px 0;
    text-align: center;
    font-size: 30px;
    background-image: url('/medium/imgs/shadowBtm.png'), url('/medium/imgs/shadowTop.png');
    background-position: bottom left, top left;
    background-repeat: repeat-x, repeat-x;
    display:none;
}
.inner-shadow {
   -moz-box-shadow:    inset 0 0 6px #000000;
   -webkit-box-shadow: inset 0 0 6px #000000;
   box-shadow:         inset 0 0 6px #000000;
}

#container {
    padding-top: 109px;
    position: relative;
    z-index: 20;
}

header {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 30;
}
#top {
    background-color: #585858;
    line-height: 18px;
    height: 27px;
    padding: 6px 3.5%;
}
#top .quick-link {
    float: left;
}
#top .quick-link a {
    display: block;
    border-right: 1px solid #fff;
    padding: 0 7px;
    float: left;
    font-family: 'DINCOND_Bold';
    font-size: 12px;
}
#top .quick-link a.last {
    border-right: 0;
}
.socials {
    
}
.socials label {
    display: inline-block;
    /*font-family: 'DIN_Bold';*/
    font-family: Verdana, Geneva, Sans-Serif;
    font-weight: normal;
    margin-right: 5px;
	margin-bottom: 0;
}
.socials label:last-child {
	/*margin-right: 0;
	margin-left: 5px;*/
}
.socials .ico-social {
    display: inline-block;
    background: url('../imgs/ico-socials.png') 0 0 no-repeat;
    line-height: 18px;
    height: 18px;
    margin: 0 5px 0 0;
    padding: 0 0 0 22px;
}
.socials .ico-social.last {
    margin-right: 0;
}
.socials .ico-facebook {
    background-position: 0 0;
}
.socials .ico-twitter {
    background-position: 0 -18px;
}

.socials .ico-youtube{
    background: url('../imgs/ico-youtube.png') 0 0 no-repeat;
}


.socials .ico-instagram {
    background: url('../imgs/icon_insta.png') 0 0 no-repeat;
}
.socials .ico-linkedin {
    background: url('../imgs/icon_linkedin.png') 0 0 no-repeat;
}


.socials .ico-rss {
    background-position: 0 -36px;
}
.socials .ico-chat {
    background-position: 0 -54px;
}

.socials .ico-follow-us{
    background: url('../imgs/icon_followus.png') 0 center no-repeat;
    padding-left:22px;
}

.socials .ico-better-brighter {
	background: url('../imgs/ico-stock.png') 0 center no-repeat;
	height: 26px;
	padding-left: 20px;
    padding: 0 3px !important;
	position: absolute;
	right: 5px;
	top: -4px;
}
.socials .ico-better-brighter iframe {
	margin-top: -1.5px;
}

.mobile-nav .socials {
	margin-top: 20px;
              margin-left: 20px;
}
.mobile-nav .socials label {
	display: block;
	font-size: 18px;
	margin-bottom: 10px;
}
.mobile-nav .socials .ico-social {
	display: block;
	color: #000;
	font-size: 16px;
	margin-bottom: 7px;
}
.mobile-nav .socials .ico-better-brighter {
	background-color: #333;
	background-image: none;
	margin: 0;
	position: static;
	left: 0;
	top: 0;
}


#top .socials {
    text-align: right;
    float: right;
	padding-right: 275px;
	position: relative;
}
.main-nav {
    color: #333132;
    font-family: 'DINCOND_Bold';
    padding-top: 35px;
}

.main-nav .logo a:focus{ text-decoration: none; }


.main-nav a.nav-item {
    display: block;
    background: url('../imgs/ico-nav.png') 0 0 no-repeat;
    color: inherit;
    line-height: 18px;
    height: 17px;
    padding: 0 0 0 22px;
}
/*Tooltip*/
.main-nav a.nav-item span {
    z-index:10;
    display:none;
    padding:14px 20px;
    margin-top: 50px;
    margin-left: -150px;
    width:300px;
    height: auto;
    position:absolute;
    color:#ffffff;
    background:#585858;
    line-height:16px;
    font-size: 14px;
}
.main-nav a.nav-item:hover span {
    display:inline;
}
.main-nav a.nav-item span:after {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 12px;
}
/*.main-nav a.nav-item:nth-child(2) span:after {
    content: "Service Tax (ST) will be calculated for domestic bills with total consumption of more than 600kWh starting on 1 September 2018";
}
.main-nav a.nav-item:nth-child(3) span:after {
    content: "CEPSI 2018 will be a platform to discuss on current issues, such as sustainability, energy trilemma, emerging megatrends, disruptive technologies, digitalisation and smarter future.";
}
.main-nav a.nav-item:nth-child(3) span:after {
    content: "Learn more about smart meters - the government’s nationwide initiative, endorsed by Suruhanjaya Tenaga and being rolled out by Tenaga Nasional.";
}
*/
.main-nav a.nav-item:nth-child(2) span:after {
    content: "TNB assures all of our valued customers that we are strongly committed to serve our customers in this time of need.";
}
.main-nav a.nav-item:nth-child(3) span:after {
    content: "Find out how you can save money by going solar";
}
.main-nav a.nav-item:nth-child(4) span:after {
    content: "Enhance your online experience today with bill payments via myTNB app, our online customer service app.";
}
.main-nav a.nav-item:nth-child(5) span:after {
    content: "Enhanced services for electricity application in Kuala Lumpur."; /*Contains information important to suppliers, such as tender prices, procurement process and business opportunities*/
}
.main-nav a.nav-item:nth-child(6) span:after {
    content: "At Tenaga Nasional Berhad, we are committed to operate and grow in a sustainable manner, while providing reliable and affordable energy, and its related services.";
}
.main-nav a.nav-item:nth-child(7) span:after {
    content: "There will be times we run preventive maintenance and checks, to reduce the risk of actual or major faults occurring";
}
.main-nav a.nav-item:nth-child(8) span:after {
    content: "Enabling sustainable energy transition";
}
/*.main-nav a.nav-item:nth-child(8) span:after {
    content: "We take our professionalism very seriously, and the TNB Whistle Blowing Information System that was launched in 2008 proves that. We will manage and investigate all complaints and reports received while keeping the identity of the complainant confidential.";
}
.main-nav a.nav-item:nth-child(8) span:after {
    content: "Get set for an exciting and challenging ride if you choose a career with us.";
} */
/*-------------*/
.main-nav a.nav-item.ico-phone {
    background-position: 0 0;
}
.main-nav a.nav-item.ico-alias {
    background-position: 0 -17px;
}
.main-nav a.nav-item.ico-line {
    background-position: 0 -34px;
}
.main-nav a.nav-item.ico-info {
    background-position: 0 -51px;
}
.main-nav a.nav-item.ico-locate {
    background-position: 0 -68px;
}
header .main-nav {
    background: url('../imgs/bg-nav.png') 0 0 repeat-x;
    height: 79px;
    padding: 0 3.5%;
}
header .main-nav .logo {
    margin: 6px 1% auto 0;
    float: left;
}
header .main-nav a.nav-item {
    margin: 30.5px 7.5px;
    font-size: 14px;
    float: left;
}
header .main-nav .contact {
    line-height: 18px;
    height: 18px;
    margin: 27.5px 0;
}
header .main-nav .search, header .main-nav .contact {
    line-height: 24px;
    height: 24px;
    margin: 27.5px 0;
    float: right;
}
header .main-nav .search {
    margin-left: 7.5px;
}
header input[type="text"] {
    /*background: url('../imgs/ico-search.png') right center no-repeat #fff;*/
    width: 135px;
    height: 24px;
    border: 0;
    margin: 0;
    padding: 0 20px 0 5px;
    outline: 0;
    -webkit-appearance: none;
}
header .main-nav .btn-menu {
    display: none;
    background: url('../imgs/btn-menu.png') 0 center no-repeat;
    width: 24px;
    height: 17px;
    margin: 22px 0;
    float: right;
}
.mobile-nav {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #efefef;
    color: #333132;
    font-family: 'DINCOND_Bold';
    width: 320px;
    height: 100%;
    padding-top :60px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10;
}
.mobile-nav .main-nav a.nav-item {
    background: 0;
    font-size: 20px;
    line-height: 20px;
    height: 50px;
    border: 15px solid #efefef;
    border-left-width: 20px;
    border-right-width: 20px;
    padding: 0 0 0 26px;
    position: relative;
}
.mobile-nav .main-nav a.nav-item:after {
    display: block;
    content: "";
    /*background: url('../imgs/ico-nav.png') 0 center no-repeat;*/
    width: 18px;
    height: 18px;
    position: absolute;
    left: 0;
    top: 1px;
}
/*.mobile-nav .main-nav a.nav-item.ico-alias:after {
    background-position: 0 -18px;
}
.mobile-nav .main-nav a.nav-item.ico-line:after {
    background-position: 0 -36px;
}
.mobile-nav .main-nav a.nav-item.ico-info:after {
    background-position: 0 -54px;
}
.mobile-nav .main-nav a.nav-item.ico-locate:after {
    background-position: 0 -72px;
}*/
.mobile-nav .main-nav a.nav-item:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}
.mobile-nav .quick-link a {
    display: block;
    background-color: #bbb;
    color: inherit;
    font-size: 14px;
    margin-bottom: 2px;
    padding: 7.5px 20px;
}
.mobile-nav .quick-link a.last {
    margin-bottom: 0;
}
.mobile-nav .quick-link a:hover {
    background-color: #666;
    color: #fff;
}
.search-bar {
    display: none;
	width: 80%;
	padding: 20px 0;
    margin: 0 auto 0;
}
.search-bar input[type="text"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    display: block;
    font-size: 16px;
    width: 100%;
    height: 36px;
    border: 0;
    margin: 0 auto;
    padding-left: 10px;
    outline: 0;
    color: black;
}
#content {
	/*background: url('../imgs/bg01.jpg') 0 0 no-repeat;*/
    background-size: cover;
    min-height: 680px;
    margin: -1px 0 0;
    /*padding: 0 3.5%;*/
    position: relative;
}
#content.fluid-content {
	/*padding: 40px 3.5% 125px;*/
	background-image: none;
	background-color: #ebecef;
	padding: 0;
}
#background {
	background: none center center no-repeat;
    background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
#background .image {
	display: none;
	background: none center center no-repeat;
               background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 105%;
}
#background img {
	display: none;
}
#content .content-info {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/*background-color: #2E2EFE;*/
    color: #231f20;
    margin: 160px 0 0 0;
    padding: 15px 30px;
    float: left;
}
#content .page-container {
	padding-top: 20px;
	padding-bottom: 135px;
}
#content .page-banner {
	margin: 0 0 20px;
	position: relative;
}
#content .page-banner img {
	display: block;
	width: 100%;
}
#content .page-banner h1.title {
	width: 100%;
	height: 50%;
	position: absolute;
	left: 0;
	top: 0;
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift', Helvetica, sans-serif;
	font-size: 60px;
}
#content .page-banner h1.title span {
	position: absolute;
	left: 10%;
	bottom: 3.5px;
}
#content .page-banner .desc {
	width: 100%;
	height: 50%;
	position: absolute;
	left: 0;
	bottom: 0;
	color: #005daa;
	font-size: 18px;
}
#content .page-banner .desc span {
	position: absolute;
	left: 10%;
	top: 3.5px;
}
#content .content-info h1.title {
    font-family: 'DIN_1451_Std_Engschrift', Helvetica, sans-serif;
    font-size: 42px;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 5px;
}
#content #home-content .content-info {
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 1);
}

#content .content-info p.desc {
    font-size: 12px;
    text-align: center;
}
#content .highlight-container {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    margin: 120px 0 0 3.5%;
    float: right;
}
#content .highlight {
    margin: 0 0 10px 0;
    padding: 20px;
    position: relative;
}
#content .highlight.highlight-red {
    background-color: #e73d2e;
}
#content .highlight.highlight-blue {
    background-color: #125ea9;
}
#content .highlight h5 {
    font-family: 'DIN_1451_Std_Engschrift', Helvetica, sans-serif;
    font-size: 22px;
}
#content .highlight.two-col {
    width: 400px;
}
#content .highlight.two-col h5 {
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fdf002;
}
#content .highlight.two-col ul {
    width: 360px;
    padding-left: 15px;
    padding-bottom: 20px;
    float: left;
}
#content .highlight.two-col li {
    font-size: 11px;
    list-style-type: disc;
    list-style-position: inside;
    padding-bottom: 3px;
}

#content .highlight.two-col li .announcement_content{
    max-width: 245px; 
    display:inline-block; 
    vertical-align: top;
}

#content .highlight.two-col li .announcement_date{
    float: right;
    display:inline-block;
    vertical-align: top;
}

.btn_yellow{
    width: 30%; 
    text-align: center; 
    margin: 0 auto; 
    background-color: #fdf002; 
    padding: 15px;
}

#content .highlight .btn-view-all {
    color: black;
}
#content .highlight .btn-view-all .arrow {
    display: none;
}
#content .content-nav {
    font-size: 0;
    text-align: left;
    width: 93%;
    position: absolute;
    left: 3.5%;
    bottom: 40px;
	pointer-events: none;
}
#content .nav-group {
    font-size: 12px;
    display: inline-block;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    /*background: url('../imgs/transparent.png') 0 0 repeat;*/
	background-color: rgba(0,0,0,0.65);
    width: 18%;
    min-height: 85px;
    /*max-width: 240px;*/
    /*min-width: 220px;*/
    margin: 10px 2.5% 0 0;
    padding: 17.5px 15px;
    vertical-align: bottom;
    pointer-events: auto;
}
#content .nav-group.last {
    margin-right: 0;
}
#content .nav-group h6 {
    /*background: url('../imgs/ico-plus.png') right center no-repeat;*/
    font-family: 'DINCOND_Bold';
    font-size: 20px;
    line-height: 1;
    padding-right: 26px;
    position: relative;
}
#content .nav-group.active h6 {
    /*background: none;*/
}
#content .nav-group .desc {
    font-family: 'DIN_Black';
    font-size: 9px;
}
#content .nav-group .btn-nav-toggle {
	background: url('../imgs/ico-plus.png') right center no-repeat;
    cursor: pointer;
    width: 19px;
    height: 18px;
    position: absolute;
    right: 0;
    top: 0;
}
#content .nav-group.active .btn-nav-toggle {
    /*cursor: default;*/
    background: url('../imgs/ico-minus.png') right center no-repeat;
}
#content.fluid-content .content-nav {
	position: fixed;
	bottom: 40px;
}
#content.fluid-content .content-nav-wrapper {
	background-color: rgba(255,255,255,0.9);
	width: 100%;
	height: 135px;
	position: fixed;
	left: 0;
	bottom: 0;
}

#content nav {
    margin-top: 15px;
}
#content nav a {
    display: block;
    margin-bottom: 10px;
    position:relative;
}
#content nav a:hover, #content nav a.selected {
    color: #e44126;
    text-decoration: none;
}
#content ul.float-list li {
	display: block;
	margin: 0 20px 20px 0;
	float: left;
}
#content ul.float-list li.last {
	margin-right: 0;
}
#content ul.breadcrumb {
	color: #010101;
	font-size: 16px;
	margin-bottom: 20px;
    text-transform: uppercase;
}
#content ul.breadcrumb li {
	margin: 0 10px 0 0;
}
#content ul.breadcrumb li.separator {
	letter-spacing: -3px;
}
#content ul.breadcrumb li.active {
	font-family: 'DIN_Bold';
}
#content .inner-content {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #dde3e6;
	color: #010101;
	font-size: 16px;
	width: 80%;
	padding: 30px 50px;
}
#content .inner-content ul {
	margi-top: 2.5px;
	padding-left: 20px;
}
#content .inner-content ul.no-list-style {
	margi-top: 2.5px;
	padding-left: 0;
}
#content .inner-content ul li {
	list-style-type: disc;
}
#content .inner-content ul.no-list-style li {
	list-style-type: none;
}
#content .inner-content h1.title {
	color: #e63e2e;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 42px;
	line-height: 1;
	text-transform: uppercase;
	margin-bottom: 20px;
}
#content .inner-content .page-desc {
	margin-bottom: 20px;
}
#content .inner-content h4.subtitle {
	color: #055ea8;
	font-family: 'DIN_Bold';
	line-height: 1;
	margin: 0 0 5px;
	padding-left: 40px;
	position: relative;
}
#content .inner-content h4.subtitle.no-style {
	padding-left: 0;
}
#content .inner-content h4.subtitle .decimal {
	position: absolute;
	left: 0;
	top: 0;
}
#content .inner-content .list-content > .list-content {
	margin: 5px 0 0 40px;
}
#content .inner-content .list-content {
	
}
#content .inner-content .list-content p, #content .inner-content .list-content .paragraph {
	margin-bottom: 20px;
}
#content .inner-content .lvl-first > p {
	margin-left: 40px;
}
#content .inner-content hr.separator {
	display: block;
	margin-bottom: 20px;
}
#content #read-meters li {
	width: 200px;
}
#content #read-meters li img {
	display: block;
	margin-bottom: 5px;
}
#content #read-meters li p {
	color: #055ea8;
	font-family: 'DIN_Bold';
	margin-bottom: 0;
}
#content #manage-account li {
	background-color: #eceded;
	width: 265px;
	margin: 0 30px 30px 0;
}
#content #manage-account li .header {
	background: url('../imgs/ico-arrow-right.png') 10px center no-repeat #125ea9;
	color: #fff;
	font-size: 16px;
	line-height: 44px;
	height: 44px;
	padding-left: 38px;
}
#content #manage-account li p {
	height: 150px;
	padding: 15px;
}
#content .announcement {
	background: url('../imgs/float-announcement.png') right 0 no-repeat transparent;
	width: 105px;
	height: 525px;
	position: absolute;
	top: 20px;
	right: 0;
}
#content .announcement .btn-toggle {
	background: url('../imgs/btn-toggle.png') 0 0 no-repeat transparent;
	width: 29px;
	height: 28px;
	position: absolute;
	left: 0;
	top: 248.5px;
}

/*
.row {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
}
.row:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}

.row .col {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	position: relative;
	min-height: 1px;
	margin: 10px;
	background-color: #333;
	height: 340px;
}

.row .col:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}

.row .col-1 {
	background-color: #005dab;
	width: 315px;
}

.row .col-2 {
	width: 650px;
	background-color: #fff;
	padding: 40px;
}

.row .col-2 h1 {
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 48px;
	line-height: 1.33;
	border-bottom: 5px solid #005daa;
	float: left;
}

.row .col-2 .desc {
	clear: both;
	display: block;
	color: #000;
	font-size: 12px;
	line-height: 1.33;
	width: 70%;
	margin: 20px 0 0;
	float: right;
}

.row .col-2 .desc p {
	margin: 0 0 7px;
}

.row .col-1 .header {
	width: 60%;
	position: absolute;
	right: 20px;
	bottom: 20px;
	text-align: right;
}

.row .col-1 h2 {
	border-bottom: 5px solid #fff;
	padding: 0 0 5px;
	color: #fff;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 28px;
	line-height: 1;
	text-transform: uppercase;
	float: right;
}

.btn-read-more {
	background: url('../imgs/ico-more.png') right center no-repeat;
	height: 18px;
	padding: 0 25px 0 0;
	color: #fff;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 18px;
	line-height: 18px;
}

.row .col-1 .btn-read-more {
	clear: both;
	display: block;
	margin: 10px 0 0;
	float: right;
}

.row .col-1 .overlay {
	display: none;
	background-color: #000;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	position: absolute;
	left: 0;
	top: 0;
}

.row .col-1 .desc {
	display: none;
	position: absolute;
	left: 20px;
	right: 20px;
	top: 20px;
	bottom: 20px;
}

.row .col-1:hover .overlay, .row .col-1:hover .desc {
	display: block;
}

.row .col-1:hover {
	background-color: #e73d2e;
}

.row .col-1.annual-report .overlay {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	background-color: #014280;
	height: 56px;
	padding: 0 25px;
	top: auto;
	bottom: 0;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 20px;
	line-height: 56px;
	opacity: 1;
}

.row .col-1.annual-report .overlay a.btn-download {
	display: block;
	position: absolute;
	right: 25px;
	top: 0;
}
*/
.search2Box {
    /*width: 80%;*/
    margin: 0% 0% 0% 13%;
    padding: 50px 0 10px 0;
}

.grid {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
}
.grid:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}

.grid .cell {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	position: relative;
	min-height: 1px;
	margin: 10px;
	background-color: #333;
	height: 340px;
}

.grid .cell:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}

.grid .cell-1 {
	background-color: #005dab;
	width: 315px;
               background-repeat: no-repeat;
}

.grid .cell-2 {
	width: 650px;
	background-color: #fff;
	padding: 40px;
}
 .cell-1 {
               background-repeat: no-repeat;
}
/* edited code @ 2014-11-12 */
/*.grid .cell-2 h1 {
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 48px;
	line-height: 1.33;
	border-bottom: 5px solid #005daa;
	float: left;
}*/

.grid .cell-2 h1 {
    text-align: center;
    padding-top: 17%;
    color: #005daa;
    font-family: 'DIN_1451_Std_Engschrift';
    font-size: 48px;
    line-height: 1.33;
    border-bottom: 5px solid #005daa;
}

.grid .cell-2 .desc {
	clear: both;
	display: block;
	color: #000;
	font-size: 12px;
	line-height: 1.33;
	width: 70%;
	margin: 20px 0 0;
	float: right;
    /* new added code @ 2014-11-12 */
    display: none;
}

.grid .cell-2 .desc p {
	margin: 0 0 7px;
}

.grid .cell-1 .header {
	width: 60%;
	position: absolute;
	right: 20px;
	bottom: 20px;
	text-align: right;
}

.grid .cell-1 h2 {
	border-bottom: 5px solid #fff;
	padding: 0 0 5px;
	color: #fff;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 28px;
	line-height: 1;
	text-transform: uppercase;
	float: right;
}

.btn-read-more {
	background: url('../imgs/ico-more.png') right center no-repeat;
	height: 18px;
	padding: 0 25px 0 0;
	color: #fff;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 18px;
	line-height: 18px;
}

.grid .cell-1 .btn-read-more {
	clear: both;
	display: block;
	margin: 10px 0 0;
	float: right;
}

.grid .cell-1 .overlay {
	display: none;
	background-color: #000;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	position: absolute;
	left: 0;
	top: 0;
}

.grid .cell-1 .desc {
	display: none;
	position: absolute;
	left: 20px;
	right: 20px;
	top: 20px;
	bottom: 20px;
}

.grid .cell-1:hover .overlay, .grid .cell-1:hover .desc {
	display: block;
    font-size: 14px;
}

.grid .cell-1:hover {
	background-color: #e73d2e;
}

.annual-row{ width: 100% !important; max-width: 1250px !important;}
.annual-block{ width: 300px !important; margin: 0 5px 10px 5px; float: left; height: 250px; background-color: transparent !important; position: relative; }
.annual-block .overlayText{ position: absolute; bottom: 5px; right: 7px; color: #eee }

/*.grid .cell-1.annual-report .overlay {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	background-color: #014280;
	height: 56px;
	padding: 0 25px;
	top: auto;
	bottom: 0;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 20px;
	line-height: 56px;
	opacity: 1;
}*/

.grid .cell-1.annual-report .overlay a.btn-download {
	display: block;
	position: absolute;
	right: 25px;
	top: 0;
}

#col-page-10 {
	background: url('../imgs/tiles/01.jpg') center center no-repeat;
}

#col-page-11 {
	background: url('../imgs/tiles/02.jpg') center center no-repeat;
}

#col-page-12 {
	background: url('../imgs/tiles/03.jpg') center center no-repeat;
}

#col-page-14 {
	background: url('../imgs/tiles/04.jpg') center center no-repeat;
}

#col-page-15 {
	background: url('../imgs/tiles/05.jpg') center center no-repeat;
}

#col-page-16 {
	background: url('../imgs/tiles/06.jpg') center center no-repeat;
}

#col-page-17 {
	background-color: #005dab;
}

.page-header {
	margin: 0 0 20px;
	padding: 0;
	position: relative;
}

.page-header .page-thumbnail, .page-header .page-info {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 49%;
	float: left;
}

.page-header .page-thumbnail {
}

.page-header .page-info {
	background-color: #fff;
	height: 100%;
	padding: 40px;
	position: absolute;
	right: 0;
	top: 0;
	overflow: hidden;
}

.page-header .page-info h1 {
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 48px;
	line-height: 1.33;
	border-bottom: 5px solid #005daa;
	float: left;
}

.page-header .page-info .desc {
	clear: both;
	display: block;
	color: #000;
	font-size: 14px !important;
	line-height: 1.33;
	width: 100%;
	margin: 20px 0 0;
	float: left;
}

.page-header .page-thumbnail img {
	width: 100%;
}

.page-content {
	background-color: #d1d1d1;
	padding: 45px 0;
	color: #000000;
}

.page-content > div, .page-content > ul {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
}

.page-nav {
	width: 25%;
	padding: 0 15px 0 20px;
}

.page-nav a {
	display: block;
	padding: 5px 0;
	color: #6d6e71;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 21px;
	text-transform: uppercase;
}

.page-nav a:hover {
	text-decoration: none;
}

.page-nav li {
	background: url('../imgs/ico-arrow.png') 10px center no-repeat;
	padding: 0 0 0 25px;
	margin: 2px 0;
}

.page-nav li:hover, .page-nav li.active {
	background-color: #abadb0;
}

.page-childs {
	width: 75%;
	padding: 0 0 0 15px;
}

.page-child {
	margin-bottom: 40px;
	padding: 0 40px 40px;
	border-bottom: 1px solid #fff;
}

.page-child.active {
	border-bottom: none;
}

.page-child .page-child-title {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 40%;
	padding: 0 40px 0 0;
	float: left;
}

.page-child .page-child-title h3 {
	display: inline-block;
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 48px;
	line-height: 1;
	text-transform: uppercase;
	border-bottom: 5px solid #005daa;
}

.page-child .page-child-desc {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 60%;
	font-size: 18px;
	padding: 0 0 0 40px;
	float: left;
}

.page-child-content {
	display: none;
	background: url('../imgs/page-child-content-arrow.png') center top no-repeat #bcbdc0;
	margin: 40px 0 0;
	padding: 70px 40px 100px;
	position: relative;
	font-size: 14px;
}

.white-bg-container{
    background-color: white;
    padding-left: 0;
    padding-right: 0; 
}

.iframeContainer{
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}
.stock_chart{
    max-width: 650px;
}

.page-child-content a.btn-close-child-content {
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 15px;
	right: 15px;
	font-family: Arial;
	font-size: 16px;
	line-height: 20px;
	text-align: center;
}

.page-child-content-single {
	display: block;
	background: none;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 40px 80px;
	float: none !important;
}

.page-child-content table {
	width: 100%;
	margin: 0 0 10px;
}

.page-child-content table th, .page-child-content table td {
	padding: 7px;
	vertical-align: middle;
}

.page-child-content table th {
	background-color: #adc9da;
	color: #055ea8;
	font-family: 'DIN_Bold';
	font-size: 15.5px;
	text-align: center;
	padding-top: 12.5px;
	padding-bottom: 12.5px;
}

.page-child-content table .title{
    background-color: #FFDF01;
    font-weight: bold;
}

.page-child-content table .content{
    background-color: #FFFAC2;
    border-bottom: 1px solid #FADF2C;
}

span .content{
    background-color: none;
    border: none;
}

.page-child-content table a{
    color: black;
}

.page-child-content table .linebreak{
    background-color: #FFFAC2;
    border-bottom: 1px solid #FADF2C;
}

.hideYellow{
    background-color: transparent !important;
    border-bottom: 1px solid transparent !important;
}
.formLeft {
    width: 30% !important;
    padding: 0px !important;
}
.formRight label {
    font-weight: 100;
}

/*.page-child-content table th{
    background-color: #FFDF01;
    font-weight: bold;
}

.page-child-content table td{
    background-color: #FFFAC2;
    border-bottom: 1px solid #FADF2C;
    border-right: 1px solid #FADF2C;
}*/

.page-child-content table.table.plain th {
	text-align: left;
}

.page-child-content table tr {
	background-color: #adc9da;
}

.page-child-content table tr:nth-child(odd) {
   background-color: #c6d9e5;
}

.page-child-content table.all-text-center td {
	text-align: center;
}

.page-child-content table td.text-center {
	text-align: center;
}

.page-child-content table.plain th {
	background-color: transparent;
}

.page-child-content table.plain tr {
	background-color: transparent;
}

.page-child-content table.plain tr:nth-child(odd) {
   background-color: transparent;
}

.page-child-content input.datepicker {
	width: 200px;
}

.page-child-content figure {
	margin: 0 0 10px;
}

.page-child-content p {
	line-height: 1.33;
	margin: 0 0 7px;
}

.page-child-content h3, .page-child-content h4, .page-child-content h5 {
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 26px;
	margin: 30px 0 10px;
}

.page-child-content h4 {
	font-size: 22px;
}

.page-child-content h5 {
	font-size: 18px;
}

.page-child-content ol, .page-child-content ul {
	padding-left: 20px;
	margin-bottom: 15px;
}

.page-child-content ol ul {
	margin-bottom: 5px;
}

.page-child-content ol li {
	list-style-type: decimal;
}

.page-child-content ul li {
	list-style-type: disc;
}

.page-child-content li {
	padding: 0 0 5px;
}

.page-child-content li ul, .page-child-content li ol {
	padding-top: 5px;
	padding-bottom: 5px;
}

.page-child-content td h3, .page-child-content td h4 {
	margin: 0;
}

.page-child-content input[type="text"] {
	padding: 4px 8px;
}
input[type="subject"] {
    padding: 4px 22px;
}

.page-child-content select {
	padding: 4px 8px;
}

.formWidthFull {
    width:50%;
}

.page-child .btn-read-more {
	background: url('../imgs/ico-more-blue.png') right center no-repeat;
	display: inline-block;
	height: 28px;
	margin: 15px 0 0 0;
	padding: 0 50px 0 0;
	color: #005daa;
	font-family: 'DIN_1451_Std_Engschrift';
	font-size: 28px;
	line-height: 28px;
}

.requiredTable td, .requiredTable th {
    border:1px solid #666666;
}

.description {
    position:absolute; 
    left:0; 
    width:100%; 
    background-color:black;
    bottom: 0;
    color:white;
    opacity:0.8; 
    filter:alpha(opacity=80);
    font-size: 14px;
}

.description_content {
    padding:10px; 
    margin:0px; 
    float:right;
}

.downloadBtn {
    padding:5px;
    float: left;
}


footer {
	width: 93%;
	position: absolute;
	left: 3.5%;
	bottom: 15px;
}
footer .socials {
    
}
footer .socials a {
    color: inherit;
}
footer .separator {
    width: 15%;
    height: 5px;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
    margin: 15px auto;
}
footer .copyright {
	font-family: 'DINCOND_Bold';
    font-size: 12px;
}
#container.no-bg footer .copyright {
	color: #232323;
}

#container.page-home {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	min-height: 600px;
	position: absolute;
	left: 0;
	top: 0;
}

#container.page-home #content {
	width: 100%;
	height: 100%;
	padding-top: 0;
	position: absolute;
	left: 0;
	top: 0;
}

#container.page-home #home-content {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

#board-of-director .director-list {
    width: 100%;
    max-width: 990px;
    margin: 0 auto;
}

#board-of-director .row {
    margin-bottom: -15px;
}
#board-of-director .director-list .row {
    margin-left: 0;
}

#board-of-director .director {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 50%;
    margin: 0 0 15px;
    position: relative;
    float: left;
}

#board-of-director .director.pull-right {
    float: right;
}

#board-of-director .director.large {
    width: 100%;
    max-width: 990px;
    margin: 0 auto;
    position: relative;
    float: none;
}

#board-of-director .director .portrait {
    min-height: 380px;
    background-color: #fff;
    width: 50%;
    float: left;
}

#board-of-director .director.large .portrait {
    width: 57.5%;
}

#board-of-director .director .portrait img {
    display: block;
    /*width: 100%;*/
}
#board-of-director .director .portrait p {
    margin:0px;
}

#board-of-director .director.large .portrait img {
    padding-top: 0;
}

#board-of-director .director .detail {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: url('../imgs/board/ico-arrow.png') -5px center no-repeat #dadada;
    width: 50%;
    height: 100%;
    padding: 15px 20px;
    position: absolute;
    right: 15px;
    top: 0;
    color: #231f20;
    font-size: 12px;
}

#board-of-director .director.large .detail {
    background-position: left center;
    width: 42.5%;
    padding: 25px 40px;
}

#board-of-director .director .detail .position {
    color: #005daa;
    font-family: 'DIN_Bold';
    font-size: 14px;
    margin: 0 0 3px;
}

#board-of-director .director.large .detail .position {
    font-size: 20px;
}

#board-of-director .director .detail .name {
    font-size: 12px;
    margin: 0 0 7px;
}

#board-of-director .director.large .detail .name {
    font-size: 17px;
    margin: 0 0 5px;
}

#board-of-director .director .detail .desc {
    font-size: 11px;
    line-height: 1.1;
}

#board-of-director .director.large .detail .desc {
    font-size: 14px;
    line-height: 1.2;
}

#board-of-director .category {
    background-color: #0053a1;
    max-width: 990px;
    margin: 30px auto;
    padding: 12.5px 0;
    color: #fff;
    font-family: 'DIN_Bold';
    font-size: 20px;
    text-align: center;
}

#board-of-director .btn-read-more {
    background-image: url('../imgs/board/ico-play.png');
    color: #005daa;
    height: 19px;
    line-height: 21px;
    position: absolute;
    right: 15px;
    bottom: 15px;
}

#board-of-director .large .btn-read-more {
    right: 40px;
    bottom: 25px;
}

#board-of-director .category.lighter {
    background-color: #00afe8;
}

#breadcrumb {
	padding: 20px 0 0 5%;
	color: #005daa;
	font-size: 16px;
	text-transform: uppercase;
}

#breadcrumb span, #breadcrumb a {
	font-family: 'DINCOND_Bold';
}

#breadcrumb a {	
	color: #005daa;
}

#breadcrumb span {
	color: #6d6e71
}

#sitemap {
	width: 90%;
	margin: 0 auto;
    text-transform: uppercase;
}

#sitemap ul {
}

#sitemap ul > li {
	width: 33%;
	float: left;
	padding-bottom: 20px;
}

#sitemap ul > li > a {
	display: block;
	color: #EA0000;
	padding: 5px 0 5px 0;
	font-size: 1.3em;
}

#sitemap ul > li > ul {
	padding: 5px 0 0 15px;
}

#sitemap ul > li > ul li {
	width: auto;
	list-style-type: disc;
	float: none;
	padding-bottom: 5px;
}

#sitemap ul > li > ul li a {
	display: inline;
	color: #333;
	font-size: 1em;
}

#sitemap li a {
	color: inherit;
}

/* Start of Accordion */
#billBox{
  width:50%;
  display:block;
  float:left;
}
#billBox img{
  width:100%;
  height:auto;
  display:block;
}
#bill-accordion {
  width:50%;
  display:block;
  float:left;
  left:330px;
}
.bill-accordion-tab h4,.bill-accordion-tab h5, .bill-accordion-tab .accP {
  padding:0;
  margin:0;
}
.bill-accordion-tab .accP {
  height:auto;
  max-height: 0;
  padidng:0px;
  background-color:#FFFAC2;
  overflow:hidden;
  transition:max-height .4s ease-out, padding .4s ease-out;
}
.bill-accordion-tab .accP tr {
  /*width:10%;*/
}
.bill-accordion-tab .accP td {
  border-bottom: 1px solid #FADF2C;
  background-color:#FFFAC2;
  color:#333;
}
.bill-accordion-tab h5 {
  color:#333;
}
.bill-accordion-tab h4 {
  font-weight:normal;
  display:block;
  height:auto;
  line-height:23px;
  background-color:#FFDF01;
  color:#000;
  border-bottom: 1px solid #FFFAC2;
  text-decoration:none;
  text-align:left;
  padding:0;
  padding-left: 10px;
}
.bill-accordion-tab h4:hover {
  background-color:red;
  cursor:pointer;
}
.bill-accordion-tab a:hover, .bill-accordion-tab a:focus {
  opacity:.9;
}
.bill-accordion-tab a:active {
  background-color:#7d7f81;
}

.bill-accordion-tab.active .accP {
  max-height: 1000px;
}
.redNumber{
  font-size:0.7em;
  font-weight:normal;
  padding:0px 6px;
  background-color:red;
  border-radius:50%;
  color:#fff;
    margin-right: 8px;
}
/* End of Accordion*/

.fadeImg {
    animation: imgFadeIn 1s ease-in-out;
    -webkit-animation: imgFadeIn 1s ease-in-out;
    -moz-animation: imgFadeIn 1s ease-in-out;
    -o-animation: imgFadeIn 1s ease-in-out;
}
@keyframes imgFadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@-webkit-keyframes imgFadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@-moz-keyframes imgFadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@-o-keyframes imgFadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

/* Start of popUpMSG */
#popUpAlert {
    position: fixed;
    top: 0;
    left: 0;
    color: white;
    width: 100%;
    height: 100%;
    background-color:rgba(0,0,0,0.7);
    z-index:500;
    display:none;
}
#popUpMsgContent {
    position: FIXED;
    color: #000;
    top: 35%;
    left: 30%;
    padding: 2%;
    /* margin: auto; */
    width: 40%;
    height: 30%;
    background-color: #fff;
    z-index: 501;
    display:none;
}
#popUpClose {
    width:100%;
    text-align:right;
    padding-bottom:10px;
}
#popUpClose:hover {
    color:red;
    cursor:pointer;
}
/* End of popUpMSG */
/**/
/**/
/**/
/**/
/**/
/* Start of ToolTip */
/*.tooltip {
    outline:none;
}
.tooltip strong {
    line-height:30px;
}
.tooltip span {
    z-index:10;
    display:none;
    padding:14px 20px;
    margin-top:0px;
    margin-left:-20px;
    width:300px;
    line-height:16px;
}
.tooltip:hover span{
    display:inline;
    position:absolute;
    color:#111;
    border:1px solid #DCA;
    background:#fffAF0;
}
.tooltip span:before{
    content: "This is the easy-to-use Tooltip driven purely by CSS.";
}
*/

/*CSS3 extras*/
/*.tooltip span{
    border-radius:4px;
    box-shadow: 5px 5px 8px #CCC;
}
*/
/* Start of ToolTip */
/**/
/**/
/**/
/**/
/**/


@media (max-width: 1180px) {
    header nav .contact {
        display: none;
    }
}

@media (max-width: 1024px) {
    #top .socials {
        /*display: none;*/
    }
    #top .socials label, #top .socials .ico-social span{
        /*display: none;*/
    }
    #top .socials .ico-better-brighter{
        /*display: inline;*/
    }

    header nav .search {
        display: none;
    }
    .search-bar {
        display: block;
    }
    #searchClick {
        color: red;
        width: 100px !important;
        height:10px !important;
    }
    #content {
    	padding-top: 20px;
    }
    
    #container.page-home #content {
    	padding-top: 0;
    }
    
    #content .content-info, #content .highlight-container {
    	margin-top: 20px;
    }
    
    #content .nav-group {
        padding: 10px;
    }
	#content.fluid-content {
		padding-top: 0;
	}
	#content .announcement {
		top: 78px;
	}
	
	#container.page-home .search-bar {
		margin-top: 120px;
	}
    #billBox{
      width:100%;
    }
    #bill-accordion {
      width:100%;
    }
}
@media (max-width: 850px) {
    #container {
        padding-top: 61px;
    }
    header {
        width: 100%;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 30;
    }
    #top {
        display: none;
    }
    header .main-nav {
        /*background-size: 1px 100%;
        height: 61px;*/
        background-size: 1px 100%;
        height: 61px;
        position: relative;
        top: 0px;
    }
    header .main-nav a.nav-item, header .main-nav .contact, header .main-nav .search {
        display: none;
    }
    header .main-nav .logo {
        display: block;
        height: auto;
        margin: 5px 0;
    }
    header .main-nav .logo img {
    	height: 50px;
    }
    header .main-nav .btn-menu {
        display: block;
    }
    .search-bar {
        display: block;
    }
    
    #container.page-home .search-bar {
		margin-top: 0px;
	}
    
    #content .content-info {
        text-align: center;
        width: 90%;
        max-width: 440px;
        margin: 5% auto;
        float: none;
    }
    #content .content-info h1.title {
        font-size: 48px;
    }
    #content .content-info p.desc {
        font-size: 12px;
    }
    #content .highlight-container {
        float: none;
        width: 90%;
        max-width: 440px;
        margin: 5% auto;
    }
    #content .highlight {
        width: auto;
        margin-left: auto;
        margin-right: auto;
        padding: 20px 40px;
    }
    #content .highlight.two-col {
        width: auto;
        display: block !important;
    }
    #content .highlight.two-col h5 {
        font-size: 22px;
        padding:10px;
    }
    #content .highlight.two-col ul {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        width: auto;
        float: none;
    }
    #content .highlight.two-col li {
        font-size: 14px;
        padding-bottom:8px;
    }
    #content .highlight.two-col li .announcement_date{
        padding-right: 20px;
    }
    #content .highlight .btn-view-all {
        font-size: 18px;
        width: auto;
        margin: 0;
    }
    #content .highlight .btn-view-all .arrow {
        display: inline;
    }
    #content .content-nav, #content.fluid-content .content-nav {
        width: auto;
        position: static;
    }
    #content .nav-group {
        display: block;
        width: 440px;
        max-width: 440px;
        margin: 0 auto 10px auto;
        padding: 20px 40px;
    }
    #content .nav-group.last {
        margin-right: auto;
        margin-bottom: 60px;
    }
    #content .nav-group h6 {
        font-size: 30px;
    }
    #content .nav-group .desc {
        font-size: 12px;
    }
    #content .nav-group.active h6 {
        background: url('../imgs/ico-minus.png') right center no-repeat;
    }
    #content .nav-group.active .btn-nav-toggle {
        cursor: pointer;
    }
	#content .search-bar {
		width: 90%;
	}
	#content .inner-content {
		width: 90%;
		margin: 20px auto;
	}
	#content.fluid-content {
		padding: 0 3.5%;
	}
	#content .announcement {
		display: none;
	}
	#content #manage-account li {
		width: 100%;
		float: none;
		margin: 0 0 20px 0;
	}
	#content #manage-account li p {
		height: auto;
	}
	#content .breadcrumb {
		width: 90%;
		margin: 0 auto;
	}
	.mobile-nav {
                            overflow: scroll;
	}
	
	footer {
		bottom: 20px;
	}
	
	#content .page-container {
		padding-bottom: 40px;
	}
	
	.page-header .page-thumbnail, .page-header .page-info {
		width: auto;
		float: none;
		margin-bottom: 20px;
		position: relative;
	}
	
	.page-header .page-info .desc {
		/*min-height: 160px;*/
	}
	
	.page-content {
		background-color: transparent;
		padding: 0;
	}
	
	.page-content .page-nav, .page-content .page-childs {
		background-color: #d1d1d1;
		width: 100%;
		float: none;
	}
	
	.page-content .page-nav {
		margin: 0 auto 20px;
		padding: 30px 3.5%;
	}
	
	.page-content .page-childs {
		margin: 0 auto;
		padding: 40px 0 0;
	}
	
	.page-child {
		padding-left: 0;
		padding-right: 0;
	}

    .page-child .page-child-header{
        padding: 0 20px;
    }
	
	.page-child .page-child-title {
		width: auto;
		float: 0;
		margin: 0 0 10px;
		padding: 0;
	}
	
	.page-child .page-child-desc {
		width: 100%;
		float: 0;
		padding: 0;
	}
	
	.page-child .btn-read-more {
		display: block;
		text-align: right;
	}
	
	.page-child-content {
		padding: 50px 20px 75px;
	}

    .white-bg-container{
        padding-left: 0;
        padding-right: 0;
    }
	
	.page-child-content-single {
		padding-left: 3.5%;
		padding-right: 3.5%;
	}
	
	#container.page-home {
		width: auto;
		height: auto;
		position: relative;
	}

	#container.page-home #content {
		width: auto;
		height: auto;
		padding-top: 20px;
		position: relative;
	}

	#container.page-home #home-content {
		width: auto;
		height: auto;
		position: relative;
	}
	
	#sitemap ul > li {
		float: none;
		width: 90%;
		margin: 0 auto;
	}
}

@media (max-width: 719px) {
	.row {
		width: 90% !important;
	}
	
	.row .col {
		float: none;
		margin: 20px auto !important;
	}
	
	.row .col-2 {
		width: auto !important;
		height: auto !important;
	}
	
	.row .col-2 .desc {
    	width: 100%;
    }
    
    .director-list .row {
        width: 100% !important;
    }
	
}

@media (max-width: 480px) {
    #content .content-info h1.title {
        font-size: 34px;
    }
    #content .content-info p.desc {
        font-size: 9px;
    }
    #content .highlight.two-col {
        padding: 20px;
    }
    #content .highlight.two-col h5 {
        font-size: 22px;
    }
    #content .highlight.two-col li {
        font-size: 12px;
        padding-top:5px;
    }
    #content .highlight .btn-view-all {
        font-size: 12px;
        right: 20px;
        top:90%
    }
    #content .nav-group {
        width: 90% !important;
    }
    #content .nav-group {
        padding: 20px
    }
    #content .nav-group h6 {
        font-size: 22px;
    }
    #content .nav-group .desc {
        font-size: 9px;
    }
	#content .inner-content {
		font-size: 12px;
		padding: 20px 25px;
	}
	#content .inner-content h1.title {
		font-size: 32px;
	}
	#content .inner-content h4.subtitle {
		padding-left: 30px;
		margin: 0 0 2.5px;
	}
	#content .inner-content .list-content > .list-content {
		margin-left: 20px;
		margin-top: 0;
	}
	#content .inner-content .lvl-first > p {
		margin-left: 30px;
	}
	#content .inner-content .list-content p, #content .inner-content .list-content .paragraph {
		margin-bottom: 10px;
	}
    footer .socials .ico-social {
        vertical-align: middle;
    }
    footer .socials .ico-facebook, footer .socials .ico-twitter, footer .socials .ico-rss {
        width: 0;
        overflow: hidden;
    }
    footer .separator {
        display: none;
    }
    footer .copyright {
        font-size: 8px;
        margin-top: 10px;
        text-align:center;
    }
}


@media(max-width: 850px){
    .annual-block{ width: 30% !important; margin: 0 1.5% 20px 1.5%; }
    .annual-block .overlayText{ color: black; }
    #content.fluid-content .content-nav-wrapper{ padding-top: 20px;  height: auto; position: relative; }

}

@media(max-width: 640px){
    .annual-block{ width: 100% !important; }   
    .grid .cell-1, .grid .cell-2{ max-width: 315px; }
    .grid{ width: auto !important; }
}

@media(max-width: 550px){
    .grid .cell-1, .grid .cell-2{ width: 100% !important; margin: 10px auto; float: none; }
}

@media(min-width: 768px){
    #content.fluid-content .content-nav-wrapper{
        bottom: -110px;
    }

    #content.fluid-content .content-nav{
        display:none;
    }
}


.hidden_nav{
    display:none;
    width: 115px; 
    height: 155px;
    position: absolute;      
    text-align: left; 
    left: -6px;  
    padding: 3px;
    padding-top: 8px;
}

.hidden_nav .nav_container{
    background-color: rgba(0,0,0, 0.8);
}

.hidden_nav .nav_container div{
    padding: 3px;
}

@media only screen 
and (min-width : 320px) 
and (max-width : 480px) 
{
    .btn_yellow{
        width: 35%;
    }
    .page-info{
        height:auto !important;
        min-height: 150px;
    }

    .page-header .page-info h1{
        font-size:30px !important;
    }

    .page-header .page-info .desc {
        float:left !important;
    }

    #board-of-director .director .detail{
        width:70% !important;
        background:#CCC !important;
        overflow-y:scroll;
        overflow-x:hidden;
        
    }

    #board-of-director .director{
        width:100% !important;
    }

    #board-of-director .row {
        margin: 0 auto;
    }
    .row {
        width: 100% !important;
    }

}

@media(max-width: 1100px){
    #board-of-director .director-list .row{
        width: 100%;
    }

    #board-of-director .director{
        width: 100%;
    }

    #board-of-director .director.large .detail{
        width: 62%;
        padding: 20px;
    }

    #board-of-director .director .portrait{
        width: 30%;
        min-height: 0px;
        /*width: 38%;*/
        height: 250px;
        overflow: hidden;
        /*max-width: 240px;*/
    }
    #board-of-director .director .portrait img {
        width: 100%;
    }

    #board-of-director .director .detail{
        width: 70%;
    }    
}
@media(max-width: 850px){
    #board-of-director .director .portrait {
        height: 300px;
    }
    
    #board-of-director .director .portrait img {
      width: 140%;
      margin-left: -28%;
    }
    #board-of-director .director .portrait .mainHead img {
        margin-left: 0;
    }
    #board-of-director .director.large .portrait img{
        margin-left: -20%;
        width: 154%; 
    }

    .goBackToOld{
        text-align: center;
    }

    .contactCall {
        top: 0;
        left: 0;
        width: 100%;
        padding: 12px 0px;
        text-align: center;
        position: absolute;
        font-size: 11px;
        display: block;
        background-color: #585858;
    }
    #popUpMsgContent {
        top: 25%;
        left: 25%;
        width: 50%;
        height: 30%;
        padding: 2%;
    }
    
    .formLeft {
        width: 40% !important;
    }
    .formWidthFull {
        width:60%;
        padding: 5px 10px;
    }
}

@media(max-width: 640px){    
    .formLeft {
        width: 50% !important;
        float: left;
    }
    .formRight {
        padding: 7px 7px 7px 0px !important;
        float: left;
        width: 100%;
    }
    .formWidthFull {
        width:100% !important;
    }
}

@media only screen and (min-width : 320px) and (max-width : 540px) {
    #board-of-director .director{
        width: 119%;
    }
    
    #board-of-director .director.large .portrait{
        width: 100%;
    }

    #board-of-director .director .portrait{
        width: 70%;
        height: 240px;
        margin-left: 6%;
        /*min-height: auto;*/
    }

    #board-of-director .director .detail{
        position: relative;
        left: 0;
        top: 0;
        width: 70% !important;
        margin-left: 6%;
        overflow: hidden;
    }

    #board-of-director .director .portrait img{
        /*max-width: 240px;*/
        width: 100%;
        margin-left: 0;
    }
    
    
    
    
    
    /* accordion 320 */
    .bill-accordion-tab .accP tr {
      /*width:100%;*/
    }
    .bill-accordion-tab .accP td {
      float:left;
      width:100%;
    }
}

@media only screen and (min-width : 320px) and (max-width : 540px) {
    #board-of-director .director{
        width: 119%
    }
    
    #board-of-director .director.large .portrait{
        width: 100%
    }

    #board-of-director .director .portrait{
        width: 70%;
        height: 240px;
        margin-left: 6%;
        /*min-height: auto;*/
    }

    #board-of-director .director .detail{
        position: relative;
        left: 0;
        top: 0;
        width: 70% !important;
        margin-left: 6%;
        overflow: hidden;
    }

    #board-of-director .director .portrait img{
        /*max-width: 240px;*/
        width: 100%;
        margin-left: 0;
    }

}
@media(max-width: 580px){
    #board-of-director .director{
        width: 119%
    }
    
    #board-of-director .director.large .portrait{
          /*padding: 20px;*/
          margin-left: 5%;
          width: 90% !important;
    }
    #board-of-director .director.large .portrait img {
          /*width: 125%;*/
    }
    #board-of-director .director.large .detail{
          margin-left: 5%;
          width: 90% !important;
    }
    #board-of-director .director.large .detail img{
          /*width: 125%;*/
    }

    #board-of-director .director .portrait{
        width: 70%;
        height: 240px;
        margin-left: 6%;
        /*min-height: auto;*/
    }

    #board-of-director .director .detail{
        position: relative;
        left: 0;
        top: 0;
        width: 70% !important;
        margin-left: 6%;
        overflow: hidden;
        background-image:none;
        background-color: #dadada;
    }

    #board-of-director .director .portrait img{
        /*max-width: 240px;*/
        width: 100%;
        margin-left: 0;
    }
    
    .tableImg{
        width: 100%;
    }
}
@media(max-width: 480px){
    .goBackToOld h4{ padding-top: 3px; }

    #board-of-director .director .portrait{
        margin-left: 6%;
        width: 90%;
    }

    #board-of-director .director .detail{
        margin-left: 6%;
        width: 90% !important;
    }
    #board-of-director .director.large .portrait img{
        margin-left: -20% !important;
        width: 154%; 
    }
    #popUpMsgContent {
        top: 20%;
        left: 5%;
        width: 90%;
        height: 30%;
        padding-right: 20px;
        padding-left: 20px;
        padding-top: 15px;
    }
    
    
}

#content .content-info h1.title { color: white; }
#content .content-info p.desc { color: white; }

img.findoutmore_img{ max-height: 25px; vertical-align: middle }
.blackfont{ color: black }

/*#content .highlight.highlight-red {
background: rgba(90,30,90, 0.5);
}

#content .highlight.two-col li {
padding: 10px 4px;
background: rgba(250, 60,60,0.5);
font-size: 11px;
list-style-type: disc;
padding-bottom: 3px;
margin: 5px;
min-height: 28px;
}

#content .highlight.two-col li .announcement_content {
max-width: 220px;
display: inline-block;
vertical-align: top;
}*/