/*******************************************************************************
*
* Copyright © 2010 Micro Ocean Technologies Sdn. Bhd.
*
* SVN: $Id: style-green.css 1286 2011-06-16 07:42:17Z yenpin $
*
*******************************************************************************/

/*
 * ========================================================
 * HTML elements
 * ========================================================
 */
body {
    background: #fff;
    color: #333;
}
a:link, a:visited {
    color: #1122CC;
/*    text-decoration: none;*/
}
a:active, a:hover {
    color: #133558;
}
th a {
    color: #003C68;
    text-decoration: none;
}
fieldset {
    background: transparent;
    border: 1px solid #ccc;
    padding: 10px;
}
table,
table.style {
    background: #fff;
    border: 1px solid #879DAD;
    width: 100%;
}
table table {
    border-width: 0;
}
table.style table {
    border-width: 1px;
}
thead th,
th,
table.style thead th,
table.style th {
    background: #AFD6BC;
    border-bottom: 1px solid #879DAD;
    border-right: 1px solid #879DAD;
    padding-right: 10px;
    text-align: left;
}
thead th a,
th a {
    display: block;
}
tfoot td,
table.style tfoot td {
    border-top: 1px solid #003C68;
}
td, th,
table.reset table.style td, table.reset table.style th,
table.style td, table.style th {
    border-left: 1px solid #879DAD;
    border-right: 1px solid #879DAD;
    padding: 5px 10px;
    vertical-align: top;
}
tr.odd td,
tr.even td {
    border-bottom: 0;
}
tr.odd td,
table.style tr.odd td {
    background: #fff;
}
tr.even td,
table.style tr.even td {
    background: #e5e6e6;
}
tr.odd td.active,
table.style tr.odd td.active {
    background: #e9ebec;
}
tr.even td.active,
table.style tr.even td.active {
    background: #d8dbdf;
}
th.active,
table.style th.active {
    background: #bcc1c7;
}
tr.selected td {
    background: #f6f6aa !important;
}
tr.selected td.active {
    background: #e8e8be !important;
}
tr td.active {
    background: #e9ebec;
}
tr.even td.active {
    background: #d8dbdf;
}
tr.red td {
    background: #fde4e4;
}
tr.red td.active {
    background: #f6cece;
}
tr.even.red td {
    background: #f9d3d3;
}
tr.even.red td.active {
    background: #f5bebe;
}
tr.yellow td {
    background: #f6f6de;
}
tr.yellow td.active {
    background: #e8e8be;
}
tr.even.yellow td {
    background: #f1f1c1;
}
tr.even.yellow td.active {
    background: #e9e998;
}
tr.green td {
    background: #dbf5d6;
}
tr.green td.active {
    background: #c2e6bc;
}
tr.even.green td {
    background: #c3e8bc;
}
tr.even.green td.active {
    background: #aad9a2;
}
tr.purple td {
    background: #eef;
}
tr.purple td.active {
    background: #d5d5ff;
}
tr.even.purple td {
    background: #ddf;
}
tr.even.purple td.active {
    background: #c4c4ff;
}
tr.blue td {
    background: #FFF;
}
tr.blue td.active {
    background: #6699FF;
}
tr.even.blue td {
    background: #3399FF;
}
tr.even.blue td.active {
    background: #0066FF;
}
tr.orange td {
    background: #FFCC99;
}
tr.orange td.active {
    background: #FF9900;
}
tr.even.orange td {
    background: #FF9933;
}
tr.even.orange td.active {
    background: #FF9900;
}
th img {
    float: right;
}
div.flash {
    border: 0;
    margin: 0 0 10px 0;
    padding: 5px 10px 5px 35px;
}
div.flash a {
    font-weight: bold;
}
div.flash-notice {
    background: #dbf5d6 url(/images/themes/customized/flash-ok.png) no-repeat 10px 6px;
}
div.flash-notice,
div.flash-notice a {
    color: #284b21;
}
div.flash-warning {
    background: #f9f9d3 url(/images/themes/customized/flash-warning.png) no-repeat 10px 6px;
}
div.flash-warning,
div.flash-warning a {
    color: #80592b;
}
div.flash-error {
    background: #f9d3d3 url(/images/themes/customized/flash-error.png) no-repeat 10px 6px;
}
div.flash-error,
div.flash-error a {
    color: #6f2525;
}
span.success,
span.error {
    background: none;
    border: 0;
    display: block;
    float: left;
    margin-top: 5px;
    padding: 0;
    width: 100%;
}
span.success {
    color: #284b21;
}
span.error {
    color: #c70018;
}
input,
select,
textarea {
    background: #fff;
    border-top: 1px solid #999;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #999;
    color: #333;
    padding: 4px;
}
input[disabled='disabled'],
select[disabled='disabled'],
textarea[disabled='disabled'] {
    background: #efefef;
}
input[type='checkbox'],
input[type='checkbox'].error,
input[type='radio'],
input[type='radio'].error {
    background: transparent;
    border: 0;
    padding: 0;
}
input:focus,
select:focus,
textarea:focus {
    border-top-color: #be974b;
    border-right-color: #f1ca7f;
    border-bottom-color: #f1ca7f;
    border-left-color: #be974b;
}
input.error,
select.error,
textarea.error {
    background-color: #fff8f8;
    border-top: 1px solid #dc8b8b;
    border-right: 1px solid #f2c0c0;
    border-bottom: 1px solid #f2c0c0;
    border-left: 1px solid #dc8b8b;
}
input[type=submit],
input[type=button],
input[type=reset],
button {
    background: #d6d6d6 url(/images/themes/customized/btn.png) repeat-x top left;
    border-top: 1px solid #e4e4e4;
    border-right: 1px solid #d2d2d2;
    border-bottom: 1px solid #b4b4b4;
    border-left: 1px solid #d2d2d2;
    color: #444;
    cursor: pointer;
    margin: 0;
    overflow: visible;
    padding: 3px 6px;
}
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover,
button:hover {
    background: #d6d6d6;
}
input[type=submit]:active,
input[type=button]:hover,
input[type=reset]:active,
button:active {
    background: #666;
    border-color: #333;
    color: #fff;
}
input[type=image] {
    background: none;
    border: 0;
    padding: 0;
}
.description {
    color: #999;
    font-size: 0.917em;
    line-height: 1.3em;
    margin-top: 5px;
}
.form-required,
.marker {
    color: #ff9000;
}
ul.pager {
    clear: both;
    margin: 10px 0;
    text-align: right;
}
ul.pager li {
    display: inline;
    padding: 5px;
}
ul.pager li.pager-current {
    color: #012b37;
    font-weight: bold;
}
table td.form-field {
    text-align: right;
    width: 20%;
}
table td.form-value {
    width: 80%;
}
ul.error_list,
ul.error_list li {
    color: #c70018;
    font-weight: bold;
    margin: 10px 0;
    padding: 0;
}
ul.error_list li {
    list-style-type: none;
}
.form-help {
    color: #666;
    float: left;
    font-size: 0.923em;
    line-height: 1.5em;
    margin-top: -15px;
    padding: 0;
    width: 100%;
}
fieldset.form-filter {
    background: #f7f7f7;
    border: 1px solid #ccc;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 10px;
}
fieldset.form-filter legend {
    background: #fff;
    border: 1px solid #999;
    padding: 3px 6px;
    text-decoration: none;
}
fieldset.form-filter legend:hover {
    background: #eee;
}
span.gold {
    color: #F4AB00;
}

/*
 * ========================================================
 * Layout styles
 * ========================================================
 */
#header {
    background: #FFFFFF;
    color: #003C68;
    padding: 10px 0;
    min-width: 960px;
}
#site-title {
    display: block;
    float: left;
    line-height: 1;
    text-decoration: none;
}
#logo {
    float: left;
    margin: 5px 10px 0 0;
}
#site-name {
    color: #fff;
    float: left;
    font-family: arial, helvetica, sans-serif;
    margin: 0;
}

#user-panel {
    float: right;
    line-height: 1;
    margin: 10px 0 0 0;
    padding: 0 0 3px 0;
}
#user-panel a {
    /*color: #0094FF;*/
}
#user-panel ul li {
    border-right: 1px solid #c4cbd3;
    float: left;
    padding: 0 7px;
}
#user-panel ul li.first {
    padding-left: 0;
}
#user-panel ul li.last {
    border-right: 0;
    padding-right: 0;
}
#bg {
    background: #fff;
    min-height: 360px;
    min-width: 960px;
}
#nav {
    padding-top: 5px;
}
#nav .container_16 {
    position: relative;
    z-index: 2;
}
#nav ul li {
    float: left;
    margin-right: 5px;
    position: relative;
    z-index: 998;
}
#nav ul li:hover {
    visibility: inherit;
}
#nav ul li.last,
#nav ul li ul li {
    margin-right: 0;
}
#nav ul li a {
    color: #fff;
    display: block;
    float: left;
    height: 28px;
    padding: 12px 10px 0 31px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
}
#nav ul li a span {
    height: 16px;
    left: 10px;
    position: absolute;
    top: 10px;
    width: 16px;
}
#nav ul li.last {
    margin-right: 0;
}
#nav ul li ul {
    background: #fff;
    border: 1px solid #abb3bc;
    margin-left: -1px;
    position: absolute;
    top: -999em;
    width: 160px;
}
#nav ul li li {
    width: 100%;
}
#nav ul li.sfHover li a {
    background: #fff;
}
#nav ul li li a {
    border-bottom: 1px solid #abb3bc;
    color: #003C68;
    height: auto;
    padding: 7px 10px;
    width: 140px;
}
#nav ul li:hover ul,
#nav ul li.sfHover ul {
    left: 0;
    top: 40px;
    z-index: 99;
}
#nav ul li li a.active,
#nav ul li li a:active,
#nav ul li li a:hover {
    background: #eaedef;
}
#nav ul li:hover li ul,
#nav ul li.sfHover li ul,
#nav ul li li:hover li ul,
#nav ul li li.sfHover li ul {
    top: -999em;
}
#nav ul li li:hover ul,
#nav ul li li.sfHover ul,
#nav ul li li li:hover ul,
#nav ul li li li.sfHover ul {
    left: 160px;
    top: 0;
}
#main {
    margin: 0 auto 20px auto;
    background: #fff;
}
#main .container_16 {
    background: #fff;
    min-height: 150px;
    padding: 10px 0;
    z-index: 1;
}
body.unauth .container_16 {
    width: 800px;
}
#footer {
    background: #E5FFE7;
    color: #7C7F7C;
    overflow: hidden;
    padding: 15px 0 20px 0;
    min-width: 960px;
}
#footer-message {
    margin-bottom: 10px;
}
#footer a {
    color: #7C7F7C;
}
#footer-nav ul li {
    float: left;
    margin-right: 20px;
}
#back-to-top {
    position: absolute;
    right: 0;
    top: 0;
}
.block {
    background: #f3f3f3;
    margin-bottom: 15px;
}
.block-subject {
    background: #cccccc;
    color: #484848;
    font-size: 1.167em;
    margin: 0;
    padding: 5px 26px 10px 5px;
    position: relative;
}
.block-subject .block-collapse {
    font-size: 0;
    height: 16px;
    line-height: 0;
    position: absolute;
    right: 10px;
    text-indent: -9999em;
    top: 10px;
    width: 16px;
}
.block-subject .block-collapse a {
    background: url(/images/themes/customized/arrow-up.png) no-repeat top left;
    display: block;
    float: left;
    height: 16px;
    width: 16px;
}
.block-subject .block-collapsed a {
    background: url(/images/themes/customized/arrow-down.png) no-repeat top left;
}
.block-content {
    padding: 10px;
}
.block p {
    margin-top: 0;
}
#tabs {
    background: #e7e7e7 url(/images/themes/customized/tabs.png) repeat-y top left;
}
#tabs ul li a {
    background: url(/images/themes/customized/tabs-arrow.png) no-repeat 5px 4px;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #fff;
    color: #4A4C4A;
    display: block;
    padding: 7px 10px 7px 20px;
    text-decoration: none;
}
#tabs ul li.first a {
    border-top: 0;
}
#tabs ul li.last a {
    border-bottom: 0;
}
#tabs ul li a:active,
#tabs ul li a:hover,
#tabs ul li a.active {
    background-color: #c6c6c6;
}
#content {
    background: #f6f6f6;
}
#content-content {
    padding: 20px;
}
#content-content p {
    margin-top: 0;
}

/*
 * ========================================================
 * Login page
 * ========================================================
 */
body.unauth #user-login,
body.unauth #user-retrieve-username,
body.unauth #user-reset-password,
body.unauth #user-new {
    background: #f1f1f1;
    border: 1px solid #ccc;
    border-bottom-width: 3px;
    border-right-width: 2px;
    min-height: 280px;
    padding: 15px;
}

/*
 * ========================================================
 * Forms
 * ========================================================
 */
 h3.form-step {
     background: #eee;
     border-bottom: 1px solid #ccc;
     padding: 5px 10px;
}

/*
 * ========================================================
 * Notice box
 * ========================================================
 */
.notice{
    background-color: #ccc;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5px;
    width: 230px;
}

/*
 * ========================================================
 * Link buttons ; mainly export csv,pdf,excel,...
 * ========================================================
 */
.link-buttons {
    margin: 10px 0;
}
.link-buttons ul,
.link-buttons ul li,
.link-buttons ul li a {
    font-weight: normal;
    line-height: 1;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-decoration: none;
}
.link-buttons ul li {
    float: left;
    margin-right: 5px;
}
.link-buttons ul li a {
    background: #d6d6d6 url(/images/themes/customized/btn.png) repeat-x top left;
    border-top: 1px solid #e4e4e4;
    border-right: 1px solid #d2d2d2;
    border-bottom: 1px solid #b4b4b4;
    border-left: 1px solid #d2d2d2;
    color: #444;
    cursor: pointer;
    display: block;
    float: left;
    margin: 0;
    overflow: visible;
    padding: 5px 10px;
}
.link-buttons ul li a:hover {
    background: #d6d6d6;
}
.link-buttons ul li a:active {
    background: #666;
    border-color: #333;
    color: #fff;
}

/*
 * ========================================================
 * Simple overlay
 * ========================================================
 */
.modal.simple_overlay,
.simple_overlay {
    position: relative;
    z-index: 9999;
}
#exposeMask {
    position: relative;
}

.customer_info table{
    font-size: small;
}

/*
 * ========================================================
 * Layout styles
 * ========================================================
 */
#bg {
    background: #fff url(/images/themes/customized/green/bg.png) repeat-x top left;
    min-width: 960px;
}
#nav ul li a.active,
#nav ul li a:active,
#nav ul li a:hover,
#nav ul li.sfHover a {
    background: #fff url(/images/themes/customized/green/nav.png) repeat-x top left;
    color: #347064;
}
#nav ul li.user-login a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -16px;
}
#nav ul li.user-login a.active span,
#nav ul li.user-login a:active span,
#nav ul li.user-login a:hover span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 0;
}
#nav ul li.forgot-username a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -48px;
}
#nav ul li.forgot-username a.active span,
#nav ul li.forgot-username a:active span,
#nav ul li.forgot-username a:hover span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -32px;
}
#nav ul li.forgot-password a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -80px;
}
#nav ul li.forgot-password a.active span,
#nav ul li.forgot-password a:active span,
#nav ul li.forgot-password a:hover span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -64px;
}
#nav ul li.dashboard a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -112px;
}
#nav ul li.dashboard a.active span,
#nav ul li.dashboard a:active span,
#nav ul li.dashboard a:hover span,
#nav ul li.dashboard.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -96px;
}
#nav ul li.campaign a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -144px;
}
#nav ul li.campaign a.active span,
#nav ul li.campaign a:active span,
#nav ul li.campaign a:hover span,
#nav ul li.campaign.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -160px;
}
#nav ul li.broadcasting a.active span,
#nav ul li.broadcasting a:active span,
#nav ul li.broadcasting a:hover span,
#nav ul li.broadcasting.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -128px;
}
#nav ul li.broadcasting a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -144px;
}
#nav ul li.broadcasting a.active span,
#nav ul li.broadcasting a:active span,
#nav ul li.broadcasting a:hover span,
#nav ul li.broadcasting.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -128px;
}
#nav ul li.surveys a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -176px;
}
#nav ul li.surveys a.active span,
#nav ul li.surveys a:active span,
#nav ul li.surveys a:hover span,
#nav ul li.surveys.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -160px;
}
#nav ul li.contacts a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -208px;
}
#nav ul li.contacts a.active span,
#nav ul li.contacts a:active span,
#nav ul li.contacts a:hover span,
#nav ul li.contacts.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -192px;
}
#nav ul li.users a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -240px;
}
#nav ul li.users a.active span,
#nav ul li.users a:active span,
#nav ul li.users a:hover span,
#nav ul li.users.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -224px;
}

#nav ul li.credit-management a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -272px;
}
#nav ul li.credit-management a.active span,
#nav ul li.credit-management a:active span,
#nav ul li.credit-management a:hover span,
#nav ul li.credit-management.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -256px;
}

#nav ul li.administration a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -304px;
}
#nav ul li.administration a.active span,
#nav ul li.administration a:active span,
#nav ul li.administration a:hover span,
#nav ul li.administration.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -288px;
}

#nav ul li.tools a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -336px;
}
#nav ul li.tools a.active span,
#nav ul li.tools a:active span,
#nav ul li.tools a:hover span,
#nav ul li.tools.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -320px;
}
#nav ul li.help a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -368px;
}
#nav ul li.help a.active span,
#nav ul li.help a:active span,
#nav ul li.help a:hover span,
#nav ul li.help.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -352px;
}
#nav ul li.report a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -176px;
}
#nav ul li.report a.active span,
#nav ul li.report a:active span,
#nav ul li.report a:hover span,
#nav ul li.report.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -160px;
}
#nav ul li.appointment a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -400px;
}
#nav ul li.appointment a.active span,
#nav ul li.appointment a:active span,
#nav ul li.appointment a:hover span,
#nav ul li.appointment.sfHover a span {
    background: url(/images/themes/customized/green/nav-icons.png) no-repeat 0 -384px;
}



#user-edit .ui-widget-content {
    border: 0;
}
#homepage-config .ui-widget-content {
    border: 0;
}

.btn-primary_backup {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #2FC0F9;
  *background-color: #00B4FC;
  background-image: -moz-linear-gradient(top, #2FC0F9, #00B4FC);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2FC0F9), to(#00B4FC));
  background-image: -webkit-linear-gradient(top, #2FC0F9, #00B4FC);
  background-image: -o-linear-gradient(top, #2FC0F9, #00B4FC);
  background-image: linear-gradient(to bottom, #2FC0F9, #00B4FC);
  background-repeat: repeat-x;
  border-color: #0044cc #0044cc #002a80;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3887198', endColorstr='#2639451', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn-primary_backup:hover,
.btn-primary_backup:focus,
.btn-primary_backup:active,
.btn-primary_backup.active,
.btn-primary_backup.disabled,
.btn-primary_backup[disabled] {
  color: #ffffff;
  background-color: #4AC9F7;
  *background-color: #4AC9F7;
}

.btn-primary_backup:active,
.btn-primary_backup.active {
  background-color: #00B4FC;
}