body{font-size: 1em; line-height: 1.5em; color: #000; font-family: arial; background: #D2D3D5; border-top: 3px solid #790305;}
h1{font-size: 1.15em;font-weight: normal; line-height: 1.5em; color: #333;}
img{/*display: block;*/ margin: 0 auto;}
p{font-size: 0.85em; line-height: 1.25em; margin: 10px 0;}
sup{font-size:xx-small; vertical-align:top;} 

#main{width: 100%; background: #D2D3D5; margin: 0 auto; overflow: hidden; }
/*.inner{width: 1280px; margin:0 auto; position: relative;}*/
.inner{width: 100%;min-width:800px; margin:0 auto; position: relative;}
/* user */
#user{background: url(../images/bg_grey.png) repeat-x; font-size: 0.65em; overflow: hidden; padding: 10px 20px;}
.thumb{float: left;}
.userdetail{color: #fff; float:left; line-height: 1.5em; margin: 0 10px;}
.userdetail a:link, .userdetail a:visited{color: #fff; text-decoration: none;}
.userdetail a:hover{text-decoration: underline;}
.username{font-weight: bold; font-size: 1.25em;}
.useraction{float: right; position: absolute; top: 0; right: 20px; width: 200px;}
a.linkblue:link, a.linkblue:visited{text-decoration: underline; color: #4EAAF6;}
a.linkblue:hover{text-decoration: none;}
#search{margin: 5px; width: 95%;}
#search input[type="text"]{color: #ccc; background: url(../images/search.png) no-repeat 95% 50% #fff; border: none; padding: 3px 8px; width: 90%;}

/* logo */
#logo{background: url(../images/header_bg_lightgrey.png) repeat-x; overflow: hidden;}
#logo a{background: url(../images/header_logo.png) no-repeat 50% 50%; text-indent: -9999px; display: block; width: 162px; height: 43px; border-right: 1px solid #ccc; float: left; padding: 5px 20px 8px 50px;}
#logo h3{float: left; color: #000; font-size: 1.25em; line-height: 2.8em; margin: 0 15px;}
a.btn:link, a.btn:visited{background: url(../images/signup_btn.png) repeat-x; border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; height: 24px; font-weight: bold; text-decoration: none; display: inline-block; line-height: 24px; text-align: center; width: 90px; margin-left: 5px; font-size: 1.15em; color: #333;}
a.btn:hover, a.btn.act{color: #fff; background: url(../images/act_btn.png) repeat-x;}

/* share */
ul#share{float: right; margin-right: 20px;}
ul#share li{float: left; margin: 10px 5px;}
ul#share li a{margin: 0; border-right: 0; padding: 0;}
ul#share li a.fb:link, ul#share li a.fb:visited{background: url(../images/header_facebook.png) no-repeat; width: 36px; height: 36px;}
ul#share li a.fb:hover{background: url(../images/header_facebook_hover.png) no-repeat;}
ul#share li a.tw:link, ul#share li a.tw:visited{background: url(../images/header_twitter.png) no-repeat; width: 36px; height: 36px;}
ul#share li a.tw:hover{background: url(../images/header_twitter_hover.png) no-repeat;}
ul#share li a.rss:link, ul#share li a.rss:visited{background: url(../images/header_rss.png) no-repeat; width: 36px; height: 36px;}
ul#share li a.rss:hover{background: url(../images/header_rss_hover.png) no-repeat;}

/* menu */
#menu ul{margin: 10px; padding: 0 2px; height: 60px;}
#menu ul li{float: left; margin: 0 20px 0 0; width: 190px; position: relative;}
#menu ul li.last{margin: 0;}
#menu ul li a:link, #menu ul li a:visited{background: url(../images/mainmenu_button.png) repeat-x; color: #000; font-weight: bold; font-size: 1em; text-decoration: none; display: block; height: 55px; line-height: 55px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0px 2px 3px #666; -webkit-box-shadow: 0px 2px 3px #666; -moz-box-shadow: 0px 2px 3px #666; position: relative;}
#menu ul li a:hover, #menu ul li a.active{background: url(../images/mainmenu_button_hover.png) repeat-x; color: #fff;}
#menu ul li a.dashboard:before{background: url(../images/mainmenu_ic_dashboard.png) no-repeat; content: ""; width: 31px; height: 26px; left: 25px; top: 14px; display: inline-block; position: absolute;}
#menu ul li a.dashboard{padding-left: 70px;}
#menu ul li a.dashboard:hover:before, #menu ul li a.dashboard.active:before{background: url(../images/mainmenu_ic_dashboard_hover.png) no-repeat;}
#menu ul li a.reports:before{background: url(../images/mainmenu_ic_reports.png) no-repeat; content: ""; width: 38px; height: 28px; left: 25px; top: 14px; display: inline-block; position: absolute;}
#menu ul li a.reports{padding-left: 80px;}
#menu ul li a.reports:hover:before, #menu ul li a.reports.active:before{background: url(../images/mainmenu_ic_reports_hover.png) no-repeat;}
#menu ul li a.services:before{background: url(../images/mainmenu_ic_service.png) no-repeat; content: ""; width: 38px; height: 30px; left: 25px; top: 14px; display: inline-block; position: absolute;}
#menu ul li a.services{padding-left: 80px;}
#menu ul li a.services:hover:before, #menu ul li a.services.active:before{background: url(../images/mainmenu_ic_service_hover.png) no-repeat;}
#menu ul li a.edm:before{background: url(../images/mainmenu_ic_edm.png) no-repeat; content: ""; width: 37px; height: 27px; left: 10px; top: 14px; display: inline-block; position: absolute;}
#menu ul li a.edm{padding-left: 52px;}
#menu ul li a.edm:hover:before, #menu ul li a.edm.active:before{background: url(../images/mainmenu_ic_edm_hover.png) no-repeat;}
#menu ul li a.pr:before{background: url(../images/mainmenu_ic_pr.png) no-repeat; content: ""; width: 35px; height: 31px; left: 12px; top: 12px; display: inline-block; position: absolute;}
#menu ul li a.pr{padding-left: 55px;}
#menu ul li a.pr:hover:before, #menu ul li a.pr.active:before{background: url(../images/mainmenu_ic_pr_hover.png) no-repeat;}
#menu ul li a.banner:before{background: url(../images/mainmenu_ic_display.png) no-repeat; content: ""; width: 33px; height: 29px; left: 15px; top: 12px; display: inline-block; position: absolute;}
#menu ul li a.banner{padding-left: 52px;}
#menu ul li a.banner:hover:before, #menu ul li a.banner.active:before{background: url(../images/mainmenu_ic_display_hover.png) no-repeat;}
.arrowup{background: url(../images/arrowup.png) no-repeat; width: 19px; height: 10px; display: block; bottom: -26px; position: absolute; left: 42%;}

/* sub-menu */
#menu ul li ul.sub-menu{
	display: none;
	height: auto;
	position: absolute;
	margin: 2px;
	z-index: 9999;
	overflow: hidden;
}
#menu ul li ul.sub-menu.shover{display: block;}
#menu ul li ul.sub-menu li {width: 245px;float: none; margin: 0; border-top: 1px solid #fff; border-right: 1px solid #ccc; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc;}
#menu ul li ul.sub-menu li a:link, #menu ul li ul.sub-menu li a:visited{border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; background: url(../images/icon_grey.png) no-repeat 10px 15px #f1f1f1; line-height: 1em; height: auto;  padding: 10px 15px 10px 40px; font-size: 0.85em;color: #1a1a1a;}
#menu ul li ul.sub-menu li a:hover{color: #1a1a1a; background: url(../images/icon_red.png) no-repeat 10px 15px #fff;}
#menu ul li ul.sub-menu li a span{font-size: 0.75em; font-weight: bold; color: #4d4d4d}

/*Manage Icon*/
.icon ul{margin:10px; padding: 0 2px 0 150px; height: 60px;}
.icon ul li{float: left; margin: 40px 40px 0 50px; width: 130px; position: relative;}
.iconhome{padding: 100px 0 120px 0; text-align:center;}

/*Message show*/
#message_result{display: none;background-color:#9CC66F;padding: 4px 0 5px 40px;font-weight: bold; text-align:center;color:#fff}
#flashMessage{background-color:#9CC66F;padding: 4px 0 5px 0;font-weight: bold; text-align:center;color:red;}
#user_result{display: none;padding: 20px 0 5px 0;font-weight: bold; text-align:center;}
.popup{background-color:#FFFFFF;padding: 4px 0 5px 0;font-size:0.85em;}

/* content */
#content{margin: 20px auto 40px; overflow: hidden;}
#leftpanel{width: 75%; float: left; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; overflow: hidden; background: #fff;}
#leftpanel.full{width: 100%;}
#leftpanel .title{background: url(../images/menu_button_hover.png) repeat-x; overflow: hidden; height: 35px; color: #fff;}
#leftpanel .title h1{float: left; color: #fff;}
h1.matrics{background: url(../images/iconbar_key-matrics.png) no-repeat 22px center; padding-left: 55px; line-height: 1.85em;}
#rightpanel{width: 290px; float: right; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; overflow: hidden; background: #fff;}
#rightpanel h3{background: url(../images/purple-bg.jpg) repeat-x; color: #fff; line-height: 35px; font-size: 1.15em; position: relative;}
.righttop{float: right; margin: 5px 20px;}

/* services */
ul.banners{overflow: hidden; padding-bottom: 80px;}
ul.banners li{float: left; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0 2px 2px #ccc; -webkit-box-shadow: 0 2px 2px #ccc; -moz-box-shadow: 0 2px 2px #ccc; margin: 20px; width: 260px; height: 150px; color: #333; position: relative; border: 1px solid #ccc; cursor: pointer;}
ul.banners li h2{font-size: 2em; margin: 15px; line-height: 1em; color: #808080;}
ul.banners li.active h2{color: #333;}
ul.banners li .desc{background: #ccc; padding: 5px 10px; position: absolute; bottom: 0; width: 240px; font-size: 0.85em;}
ul.banners li.active .desc{color: #fff; background: url(../images/menu_button_hover.png) repeat-x; border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px;}
.arrowright{background: url(../images/arrowright.png) no-repeat; width: 11px; height: 22px; margin-left: 15px; display: inline-block;}
.tips{display: none; color: #fff; background:#1d1d1d; padding:10px; width: 270px; position:absolute; z-index:1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; left: 150px; font-size: 0.85em;}

/* data table */
article.data, article.report{border: 1px solid #999; margin: 20px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 20px 50px; min-height: 460px;}
article.report{padding: 20px;}
article.report table{width: 100%; font-size: 0.85em; border-right: 1px solid #666; border-top: 1px solid #666;}
article.report table thead th{background: url(../images/thead-bg.png) repeat-x; color: #fff; font-weight: normal; line-height: 35px; border-left: 1px solid #666; border-bottom: 1px solid #666;}
article.report table tbody td{text-align: center; font-size: 0.95em; padding: 3px; border-left: 1px solid #666; border-bottom: 1px solid #666; background: #f2f2f2;}
article.report table tfoot td{text-align: center; font-weight: bold; border-left: 1px solid #666; border-bottom: 1px solid #666; padding: 5px;}
article.report table tbody tr.alter td, article.report table tfoot tr.alter td{background: #dceafc;}
ul.tabledata li{width: 820px;}
.data table{width: 100%; font-size: 0.85em;}
.data table thead th{background: url(../images/thead-bg.png) repeat-x; color: #fff; height: 30px; vertical-align: top; padding: 5px 20px;}
.data table tbody{border-top: 3px solid #B92229;}
.data table tbody tr td{background: #f2f2f2; padding: 8px; font-size: 0.85em; border-top: 1px solid #fff; border-bottom: 1px solid #ccc; text-align: center;}
.data table tbody tr.alter td{background: #dceafc;}
.data table tbody tr:hover .alter td {background-color:#D7DEEE;}
.data table tbody tr:hover td {background-color:#D7DEEE;}
.data table tbody tr td.first, .data table thead th.first{ padding-left:2px; }
.data table tbody tr td.redtxt{color: #B72225; font-weight: bold;}
.data table tbody tr td.label{width: 200px; text-align: right; padding: 5px 10px;}
.data table tbody tr td.label span{color: #ff0000;}
.data table tbody tr td.input{ text-align: left; padding: 5px 10px 0 20px;}
.data table tbody tr td input[type="text"].inputdate{width:80px; border: 1px solid #ccc; height: 18px;}
.data table tbody tr td input[type="text"].inputdatetime{width:130px; border: 1px solid #ccc; height: 18px;}
.data table tbody tr td input[type="text"], input[type="email"], table td input[type="password"],textarea, table td select{width: 350px; border: 1px solid #ccc; height: 18px;}
.data table tbody tr td textarea{width: 350px; border: 1px solid #ccc; height: 100px;}
.data table tbody tr td input[type="submit"], table td input[type="reset"], article input[type="submit"], article input[type="reset"]{background: url(../images/bg_button.png) repeat-x; font-weight: bold; border: none; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 3px 20px; box-shadow: 0 1px 2px #666; -moz-box-shadow: 0 1px 2px #666; -webkit-box-shadow: 0 1px 2px #666; cursor: pointer; margin-right: 10px;}
a.view:link, a.view:visited{color: #000; font-size: 0.95em; background: url(../images/bg_button.png) repeat-x; text-decoration: none; padding: 3px 8px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; box-shadow: 0 2px 2px #666; -webkit-box-shadow: 0 2px 2px #666; -moz-box-shadow: 0 2px 2px #666;}
a.view:hover{color: #fff; background: url(../images/act_btn.png) repeat-x; text-decoration: none;}

/*button submit*/
button,.buttonSubmit,.loginButton{color: #000; font-size: 0.95em; background: url(../images/bg_button.png) repeat-x; text-decoration: none; padding: 3px 8px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; box-shadow: 0 2px 2px #666; -webkit-box-shadow: 0 2px 2px #666; -moz-box-shadow: 0 2px 2px #666;}
button,.buttonSubmit:hover,.loginButton:hover{color: #fff; background: url(../images/act_btn.png) repeat-x; text-decoration: none;}

.list_carousel{position: relative;}
a.next, a.prev{position: absolute; display: block; width: 35px; height: 35px; text-indent: -9999px; top: 50%;}
a.next:link, a.next:visited{background: url(../images/2dashboard_arrow_right.png) no-repeat; right: -45px;}
a.next:hover{background: url(../images/2dashboard_arrow_right_hover.png) no-repeat;}
a.prev:link, a.prev:visited{background: url(../images/2dashboard_arrow_left.png) no-repeat; left: -45px;}
a.prev:hover{background: url(../images/2dashboard_arrow_left_hover.png) no-repeat;}
.pager{display: none!important;}
a.xls:link, a.xls:visited{background: url(../images/ic_excel.png) no-repeat left center; color: #666; padding-left: 20px; font-size: 0.8em; display: inline-block;}
#paginate {font-size:0.90em;text-align:right;text-decoration: none;}

/*button*/
.Bbutton{color: #000; font-size: 0.95em; background: url(../images/bg_button.png) repeat-x; text-decoration: none; padding: 3px 8px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; box-shadow: 0 2px 2px #666; -webkit-box-shadow: 0 2px 2px #666; -moz-box-shadow: 0 2px 2px #666;}
.Bbutton:hover{color: #fff; background: url(../images/act_btn.png) repeat-x; text-decoration: none;cursor:pointer;}

/* sub menu */
.subnav{clear: both; overflow: hidden; margin: 0 0 15px;}
.subnav ul{overflow: hidden; padding:0 2px 5px;}
.subnav ul li{float: left; margin: 0 14px 0 0;}
.subnav ul li.last{float: left; margin: 0;}
.subnav ul li a:link, .subnav ul li a:visited{background: url(../images/menu_button.png) repeat-x; line-height: 35px; display: block; width: auto; text-align: center; text-decoration: none; font-weight: bold; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #000; box-shadow: 0 2px 2px #666; -webkit-box-shadow: 0 2px 2px #666; -moz-box-shadow: 0 2px 2px #666; padding:0 24px 0 25px;}
.subnav ul li a:hover, .subnav ul li a.active{background: url(../images/menu_button_hover.png) repeat-x; color: #fff;}


.details{background: #fff;}
a.button:link, a.button:visited, a.button:hover{background: #780000; color: #fff; border: none; text-decoration: none; padding: 3px 20px 3px 8px; text-transform: uppercase; font-size: 0.8em; font-family: arial; position: relative; margin: 0 0 10px;}
.button:after{background: url(../images/act_btn.png) no-repeat; width: 9px; height: 6px; position: absolute; right: 8px; top: 30%; content: '';}
#footer{background: url(../images/bg_grey.png) repeat-x;}
#footer p{text-align: center; color: #fff; line-height: 60px; margin: 0; font-size: 0.75em;}
a:link, a:visited{color: #302F91; text-decoration: underline;}
a:hover{text-decoration: none;}

/* sidebar */
.widgets{font-size: 0.85em;}
.widgets ul li{padding:20px; border-bottom: 1px solid #ccc;}
.widgets ul li p{margin: 0;}
.date{font-size: 0.85em; font-weight: bold;}
.widgets h3.news:before{background: url(../images/iconbar_metric-news.png) no-repeat; width: 24px; height: 18px; display: inline-block; position: absolute; content: ""; top: 8px; left: 20px; }
.widgets h3.pad:before{background: url(../images/pad-ic.png) no-repeat; width: 24px; height: 18px; display: inline-block; position: absolute; content: ""; top: 8px; left: 20px; }
.widgets h3.news, .widgets h3.pad{padding-left: 50px;}
.widgets form{width: auto; margin: 20px;}
.widgets form table{width: 100%;}
.widgets form table td input[type="text"], .widgets form table td select, .widgets form table td textarea{width: 98%;}
.widgets form table td input[type="submit"]{background: url(../images/bg_button.png) repeat-x; border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0 1px 3px #666; -webkit-box-shadow: 0 1px 3px #666; -moz-box-shadow: 0 1px 3px #666; cursor: pointer; padding: 3px 20px; font-size: 0.85em; color: #662d91; font-weight: bold;}

/* login form */
#loginform{background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 35%; max-width:450px;min-width:400px;margin: 50px auto 20px; overflow: hidden;}
#loginform form{margin: 20px 30px 60px; width: auto;}
#loginform form table{width: 100%;}
#loginform form table thead th{padding: 3px 0 20px; font-size: 0.85em; text-align: center;}
#loginform form table tbody td{padding: 3px 5px; font-size: 0.8em;}
#loginform form table tbody td.intro{text-align: center;}
#loginform form table tbody td.label{text-align: right; width: 35%;}
#loginform form table tbody td.capcha{padding-top: 30px;}
#loginform form input[type="text"], #loginform form input[type="password"]{width: 80%; border: 1px solid #ccc; height: 18px;}
#loginform form input[type="submit"]{background: url(../images/bg_button.png) repeat-x; font-weight: bold; border: none; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 3px 20px; box-shadow: 0 1px 2px #666; -moz-box-shadow: 0 1px 2px #666; -webkit-box-shadow: 0 1px 2px #666;}
.forgot{background: #333; text-align: right; padding: 0 10px;}
.forgot a{color: #fff; text-decoration: none; font-size: 0.8em; background: url(../images/q-ic.png) no-repeat left center; padding: 10px 0 10px 20px; line-height: 2.5em;}
.copy{text-align: center; font-size: 0.75em;}

/* Content */
article{padding: 20px;}
article h1{margin: 10px 40px;}
.bordergray{border: 1px solid #999; margin: 15px 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 20px 50px; min-height: 500px; font-size: 0.85em;}
.box4{width: 30%; float: left;}
.box8{width: 60%; float: left; margin-left: 100px;}
table{width: 100%;}
table td.label{width: 30%; text-align: right; padding: 5px 10px;}
table td.label span{color: #ff0000;}
table td{padding: 5px 10px;}
table td input[type="text"], table td input[type="password"], table td select{/*width: 100%;*/ border: 1px solid #ccc; height: 18px;}
table td input[type="submit"], table td input[type="reset"], article input[type="submit"], article input[type="reset"]{background: url(../images/bg_button.png) repeat-x; font-weight: bold; border: none; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 3px 20px; box-shadow: 0 1px 2px #666; -moz-box-shadow: 0 1px 2px #666; -webkit-box-shadow: 0 1px 2px #666; cursor: pointer; margin-right: 10px;}

/* popup */
.details article{padding: 40px 25px; background: url(../images/gradient_bg_pop.png) repeat-x bottom left; border-bottom: 1px solid #ccc;}
.details ul{list-style: disc; margin: 15px 25px;}
.details ul li{font-size: 0.9em;}
.details ul li .orange{color: #e95c25; font-size: 1em;}
.details .thumb{padding: 2px; border-top: 1px solid #fff; background: #DFDCD7;}
.details h3{font-size: 1.25em; font-weight: normal; margin-top: 20px;}
.details article p.orange{ color: #e95c25; font-size: 1.1em; margin-top: 0;}
.details article a.button{font-size: 0.7em; line-height: 1.35em; float: right;}
#cboxClose{background: url(../images/close_bt.png) no-repeat; width: 23px; height: 23px; text-indent: -9999px; cursor: pointer;}