@import url('reset.css');

/* HTML Based Primitives */

body {
  margin:0;
  padding:0;
}

fieldset {
	margin:10px;
	border:1px solid #ccc;
	padding:20px 20px 20px 20px;
}

legend {
	margin-left:-10px;
	color:#888;
	font-weight:bold;
  padding-left:4px;
  padding-right:4px;	
}

legend img, legend button {
  vertical-align: middle;
  margin:0 4px;
}

body,td, th {
  font-size: 12px;
  font-family: "Helvetica","Arial",sans-serif;
}

th{
  font-weight: bold;
  white-space: nowrap;
}

h1 {
	font-weight:bold;
	font-size:12pt;
}

h2 {
	font-weight:bold;
	font-size:12pt;
  color: #4F6B61;
}

h5 {
  margin: 4px 0;
}
label { font-weight:bold; }

table { border-spacing:1px;}
th, td { padding:2px 5px; }

thead th {
    background:#ccc;	
}


button {
  white-space: nowrap;
}

button span{
  line-height: 18px;
  vertical-align: middle;
}

/* End HTML Based Primitives */



/* Non-HTML Based Primitives */

.error,.info {
  margin: 0px;
  zoom:1;
}

div#eventMsgContainer {
	margin:20px 0px 10px 5px;
	padding:10px 0px 20px 40px;
}

div#errorMsg {
	position: absolute;
	top: 130px;
	right: 10px;
}

div#eventMsgContainer.error {
	background: transparent url(/esuite/shared/images/error_large.png) no-repeat scroll left top;
}

div#eventMsgContainer.info {
	background: transparent url(/esuite/shared/images/info_large.png) no-repeat scroll left top;
}

.error{
  color: #c00;
}

.error ul{
  list-style: none;
}

.info{
  color: #0000ae;
}

.required {
    color: #000000;
}

.hide {
    display: none;
}


td.buttonbar{
  text-align: right;
}

div.buttonbar{
  text-align: right;
  padding: 10px 0;
}
div.buttonbar button.back{
  float: left;
}

/* End Non-HTML Based Primitives */



/* Main Page Titles */
#modalContentPane {
	margin: 0px;
	padding: 0px;
}
div#mainContentPane h1,
div#modalContentPane h1 {
  margin-bottom: 20px;
  font-size: 21px;
  line-height: 22px;
  text-align: left;
}
div#mainContentPane h1 img,
div#modalContentPane h1 img {
  vertical-align: middle;
  margin-right: 3px;
}

/* Fieldset Legends */
div#tabbedContent fieldset legend img {
  vertical-align: middle;
}

#bodyContainer {
  text-align:left;
}

/* These are the new standard, USE THEM!! */
/* If you are overriding anyone of the following (even,odd,selected,over), please override
   all of them and in the same order. Otherwise, MouserOverCssAttacher and/or RowInputChecker
   don't work properly. If you have any questions, talk to Spencer  */
.even {
  background-color: #fff;
}
.odd {
  background-color: #E6E6E6;
}
.selected {
  background-color:#EEEE99;
}
.over {
  background-color: #ccc;
}

/* These are the new standard, USE THEM!! */

/* Standard for tabs */
div#mainContentPane ul.tabs li {
  float: left;
  padding: 0 0 0 8px;
  background: transparent url(/esuite/images/tab-left.png) no-repeat scroll left top;
  border-bottom: none;
  line-height: 16px;
  list-style-image: none;
  list-style-position: outside;
}
div#mainContentPane ul.tabs li a {
  background: transparent url(/esuite/images/tab-right.png) no-repeat scroll right top;
  display: block;
  padding: 3px 10px 3px 3px;
  color: #fff;
}
div#mainContentPane ul.tabs li.selected {
  background-image: url(/esuite/images/tab-left-selected.png);
}
div#mainContentPane ul.tabs li.selected a {
  background-image: url(/esuite/images/tab-right-selected.png);
  color: #999;
}
.tabContent {
  clear: left;
  border: 1px solid #d5d5d5;
}

div#temp {
	width: auto;
	height: 150px;
	border: 1px solid #000000;
}

div.wrapperA {
	width: 48%;
	height: auto;
	float: left;
	margin-left: 5px;
	margin-top: 1%;
	padding: 0px;
}

div#volumePanel table thead tr th {
  font-size:11px;
}

div#volumePanel table tbody {
  text-align:left;
  font-size:11px;
}

div#volumePanel table tbody tr th {
  font-weight:normal;
}

div#volumePanel table th { padding:5px 5px; }
div#volumePanel table td { padding:5px 9px; }

#alertsHeader h3 span, #pvHeader h3 span {
  display:block;
  margin-top:4px;
  height:43px;
  padding:12px 0 0 65px;
  font-size:16px;
} 

table.magnetTable {
	border-spacing:1px;
	width:300px;
	margin:0 25px;
}
table.magnetTable th {
	background:#f53ca0;
	padding:3px;
	color:#fff;
	font-size:12px;
	font-weight:bold;
}
table.magnetTable td {
	background:#fff;
	padding:3px 6px;
}
table.magnetTable td.column1 {
	width:200px;
	font-weight:bold;
}
table.magnetTable td.column2 {
	width:100px;
	text-align:right;
}


#navWrapper1 {
	margin-bottom:30px;
}

div#savedReportsMagnet ul li.evenrow,
div#savedReportsMagnet ul li.oddrow {
  padding: 3px;
}

div#savedReportsMagnet ul li a {
  display: block;
  margin-bottom: 5px;
}

/* START TINY SPICY MENUS */


/* -[ TOP-LEVEL MENU ]------------------------------------------------------- */
ul#tsNavigation {
    list-style: none;
    padding:    0;
    margin:     0;
    cursor:     default;
}

ul#tsNavigation ul {
    list-style: none;
    margin:     0;
    padding:    0;
    position:   absolute;
}

li.topLevel {
    float:      left;
    padding:    0px 18px 0px 18px;
    z-index:    10;
    margin:     0;
}

li.topLevel a, li.topLevel a:visited, li.topLevel a:active, li.topLevel a:link {
  
  font-weight:bold;
  color:white;
	text-decoration: none;
}

/* -[ SUBMENU ]-------------------------------------------------------------- */
ul.submenuL1 {
    visibility:    hidden;
    z-index:       20;
    white-space:   nowrap;
}

ul.submenuL1 li a {
  color:black;
  font-weight:normal;
	text-decoration: none;
}

ul.submenuL1 li a:hover {
	text-decoration: none;
}

ul.submenuL1 li {
    z-index:    30;
    padding:    3px 15px;
    position:   relative;
    text-align: left;
    cursor:     pointer;
}

ul.submenuL1 li.first {
    border-top: none 0px;
}

ul.submenuL1 li.hasSubmenu {
    background:#ebfad8  url(/esuite/images/arrow.gif) right center no-repeat;
    padding-right: 24px;
}

#tsNavigation ul.submenuL1 li.over {
    background: white;
}

/* -[ TERTIARY MENU ]-------------------------------------------------------- */
ul.submenuL2 {
    z-index: 30;
	white-space:   nowrap;
	margin-left:       3px;
	position:      relative;
}


/* END TINY SPICY MENUS */


/**************************************
/ Styles for email application below  /
**************************************/
 .welcometext {
  text-decoration: none;
  color: #428831;
  font-weight: bold;
  font-size: 20pt;
}

 .headertext {
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 10px;
}


 .emaillisttopfoldernametext {
  color: #6E7A94;
  font-size: 14px;
  font-weight: bold;
}


 a.emailmessageviewattachmentslink {
  text-decoration: underline;
  color: #6E7A94;
  font-size: 10px;
}

 a.emailmessageviewattachmentslink:hover {
  text-decoration: underline;
  color: #6E7A94;
  font-size: 10px;
}


.viewmessageheadertext, td.viewmessageheadertext {
  font-size: 10px;
  background: #D6D3CE;
}

 .inputbox, td.inputbox, table.inputbox{
  border-style: solid;
  border-width: 1px;
  border-color: #000000 #FFFFFF #E4E4E4 #000000;
  padding: 3px;
  font-size: 10px;
  background: #FFFFFF;
}

.calendarPopup {
    position:               absolute;
    visibility:             hidden;
    background-color:       #fff;
}
.calendarIcon {
    border: 0px;
}

/***************************************************************/
/* Styles to modify the default styles for the calendar widget */
/***************************************************************/
TD.cal { font-size: 8pt; }
TD.calmonth {  font-size: 8pt; text-align: right;}
TD.caltoday {  font-size: 8pt; text-align: right; color: #fff; background-color:#C0C0C0; border: 1px solid #800000;}
A.todaylink {  font-size: 8pt; height: 20px; color: black; }
A.cal { text-decoration:none; color:#000000; }
A.calthismonth { text-decoration:none; color:#000000; }
A.calothermonth { text-decoration:none; color:#808080; }



/**************************************
/     Styles for DRB below            /
**************************************/


.drbcurrentperiodpanelborder{
  color: #FFFFFF;
  font-weight: bold;
  font-size: 12px;
  background: #a0c75f;
}

.drbcurrentperiodpaneloutline{
  background: #a0c75f;
}


.drbbadalertspanelborder{
  color: #FFFFFF;
  font-weight: bold;
  font-size: 12px;
  background: #a0c75f;
}

.drbbadalertspaneloutline{
  background: #a0c75f;
}

.helpheader, td.helpheader {
  color: #6666CC;
  font-weight: bold;
  font-size: 14px;
}

.rightbar, td.rightbar {
  padding:0 25px 0 10px;
}

/**************************************
/     Styles for eCard Below          /
**************************************/
#ecardSettingsTable {
	border: 0px solid #000000;
}
.recipients {
	width: 100%;
}
#realTxtArea {
	display: block;
	width: 100%;
}



/**************************************
/ Styles for Leads Alerts below    /
**************************************/
td.leadsalertsheading, a.leadsalertsheading, a.leadsalertsheading:active, a.leadsalertsheading:link, a.leadsalertsheading:visited, td.leadsalerts {
  font-weight: bold;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
  text-align: left;
  font-weight: bold;
  background: #a0c75f;
}

td.leadsalertsheading {
  padding: 2px;
  border-style: dotted;
  border-width: 0px 0px 1px 0px;
  border-color: #a0c75f;
}

/**************************************
/ Styles for Customer Alerts below    /
**************************************/
td.customerAlertsHeading, a.customerAlertsHeading, a.customerAlertsHeading:active, a.customerAlertsHeading:link, a.customerAlertsHeading:visited, td.customerAlerts {
  font-weight: bold;
  font-size: 16px;
  color: #FFFFFF;
  text-decoration: none;
  text-align: left;
  font-weight: bold;
}

td.customerAlertsHeading {
  padding: 2px;
  border-style: dotted;
  border-width: 0px 0px 1px 0px;
}

/**************************************
/ Styles for Downline Alerts below    /
**************************************/
td.downlineAlertsHeading, a.downlineAlertsHeading, a.downlineAlertsHeading:active, a.downlineAlertsHeading:link, a.downlineAlertsHeading:visited, td.downlineAlerts {
  font-weight: bold;
  font-size: 16px;
  color: #FFFFFF;
  text-decoration: none;
  text-align: left;
  font-weight: bold;
}

td.downlineAlertsHeading {
  padding: 2px;
  border-style: dotted;
  border-width: 0px 0px 1px 0px;
}

/******************************************
/ Styles for CRM                          /
******************************************/
.crmlandingpagecolumnheading,.crmlandingpagecolumnheadingsub {
  text-align: center;
  font-weight: bold;
  font-size: 14px;
  color: #ffffff;
  text-decoration: none;
  text-align: left;
  padding: 3px;
}

.crmlandingpagecolumnheadingsub {
  color: #000;
  font-weight: bold;
  font-size: 12px;
  border-width: 0px 0px 1px 0px;
  border-color: #a0c75f;

}

.crmLandingPageBox{
padding-left: 15px;

}

.crmlandingpagetodaysdate {
  color: #000000;
  font-weight: bold;
  font-size: 12px;
}

.crmlandingpageeventtime {
  color: #666666;
  font-size: 11px;
}

/* Styles for Enrollment */
#sponsorInformation {
  vertical-align: middle;
}

/* Styles for table scolling */
.tableBoxOuter { width: 100%; height: 300px; }
#reportTable .rowHeader {
                color:           black;
                font-size:   11px;
}

#reportTable .rowHeader a {
        color:       black;
        font-weight: normal;
}

#reportTable .rowHeader a:link,
#reportTable .rowHeader a:visited,
#reportTable .rowHeader a:active {
        text-decoration: none;
}

#reportTable .rowHeader a:hover {
        text-decoration: underline;
}
#exportListInfo {
	text-align: left;
	overflow: hidden;
}

/* BEGIN CMS admin edit buttons */


#cmsManagement {
	font-weight:bold;
	padding:5px 8px;
	text-align:center;
	background-color:#d6d6d6;
  border-left:1px solid white;
  border-bottom:1px solid #666;
  border-right:1px solid #666;
	opacity:.85;
	filter:alpha(opacity=85);
	z-index:100;
  position:absolute;
  left:10px;
  text-align:middle;
  top:0px;
}

#cmsManagement p {
  text-align:center;
  padding-top:5px;
  padding-bottom:5px;
}

.admin {
  background-image:url(/esuite/images/admin-back.gif);
  border-style:dashed;
  border-width:1px;
}

.editButton {
  margin-top:-1px;
  font-size:11px;
  width:30px;
  float:right;
  text-align:center;
  background-color:#ff0000;
  color:#ffffff;
  border-style:outset;
  border-width:0 2px 2px;
  z-index: 99;
  cursor: pointer;
}

.scrollAtXRows {
  height:180px;
  overflow: scroll;
  border:1px solid #666;
  border-right-color:#E6E6E6;
  border-bottom-color:#E6E6E6;
}

/* END CMS admin edit buttons */

#siteClosedMessage {
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  width: 350px;
}

/********* MENU PART **********/


/**************************************
/     Styles for Module Tabs below    /
**************************************/
div#mainContentPane div#tabBar {width:100%;background: url("/esuite/shared/images/tab-border-bottom.gif") left bottom repeat-x;}
div#mainContentPane div#tabBar ul {margin:0;padding:0;list-style:none;padding-left:10px;float:left;}
div#mainContentPane div#tabBar ul#viewTabs {padding-left:20px; padding-right:10px; }
div#mainContentPane div#tabBar li {float:left;margin:0;padding:0 0 0 9px;border-bottom:1px solid black;}
div#mainContentPane div#tabBar li#selectedTab {border-width:0;}
div#mainContentPane div#tabBar a {font-weight:bold;white-space:nowrap;text-decoration:none;display:block;padding:2px 15px 1px 8px;}
div#mainContentPane div#tabBar a:hover { text-decoration:underline; }
div#mainContentPane div#tabBar li#selectedTab { background: url("/esuite/images/tab-round-left-selected.gif") no-repeat left top; }
div#mainContentPane div#tabBar li#selectedTab a { color:black;background: url("/esuite/images/tab-rounded-right-selected.gif") no-repeat right top;}
div#mainContentPane div#tabBar li#selectedTab a { padding-bottom:2px; }
div#mainContentPane div#tabBar div { margin-right:1px; }
div#mainContentPane div#tabBar li img { vertical-align: middle; }
div#mainContentPane ul#viewTabs li { background:url("/esuite/images/tab-rounded-left.gif") no-repeat left top; }
div#mainContentPane ul#viewTabs a {color:white;background: url("/esuite/images/tab-rounded-right.gif") no-repeat right top;}
div#mainContentPane ul#viewTabs li#selectedTab { background:url("/esuite/images/tab-round-left-selected.gif") no-repeat left top; }
div#mainContentPane ul#actionTabs li {padding:0 0 0 9px;background:url("/esuite/images/tab-action-rounded-left.gif") no-repeat left top;}
div#mainContentPane ul#actionTabs a {color:#6b9f00;background: url("/esuite/images/tab-action-rounded-right.gif") no-repeat right top;padding:2px 15px 1px 8px;}
div#mainContentPane ul#actionTabs li#selectedTab { background:url("/esuite/images/tab-action-rounded-left-selected.gif") no-repeat left top; }
div#tabbedContent{clear:both; width:auto !important; width:100%; border:1px solid black;border-top:none;text-align:left;padding:8px; background-color:white;}
/***** END Module Tabs STYLES *****/

.printMailingLabels_TableWidth { width: 100%; }
.chooseAddress_SearchOptions { text-align: center; }
.chooseAddress_ToolBar { text-align: right; }

div#loadingBox {
  text-align:left;
  border: 1px solid #fef3e4; 
  color:            white;
  padding: 10px; 
  position: absolute; 
  visibility: hidden;
  font-weight: bold; 
  font-size: 1.3em; 
  padding:1.3em 2em 1.3em 4em;
  background:#a0c75f url(/esuite/images/clock_anim.gif) no-repeat  8% 50%;
}

div#exportingAddressHelp {
	text-align:left;	
}
div#exportingAddressHelp li {
	color:white;
}


table.reportConstraintsBody td {
	padding: 1px;
}

table.reportHeader td, tr.reportHeader td{
  padding:3px;
}

table#reportTable {
	border-spacing:1px 1px;
}

img { vertical-align: middle; }

/* Begin MiniCalendar */

div.miniCalendar td {
  padding: 2px 1px;
}

div.miniCalendar {
  text-align: center;
}

div.miniCalendar h2 {
  background-color: #A0C75F;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  padding: 4px;
}

div.miniCalendar h2 a.previous {
  display: block;
  float: left;
  background: transparent url("/esuite/shared/images/previous.png") no-repeat left top;
}

div.miniCalendar h2 a.next {
  display: block;
  float: right;
  background: transparent url("/esuite/shared/images/next.png") no-repeat left top;
}

div.miniCalendar h2 a {
  color: #fff;
}

div.miniCalendar h2 a.previous,
div.miniCalendar h2 a.next,
div.miniCalendar h2 a img {
  width: 16px;
  height: 16px;
}

div.miniCalendar h2 a img {
  vertical-align: middle;
}

div.miniCalendar table {
  margin: 0 auto 10px auto;
  border-spacing: 0;
  width: 100%;
  border-bottom: 1px solid #ccc;
}

div.miniCalendar table thead th {
  font-weight: bold;
  background-color: #eee;
  border: 1px solid #ccc;
  border-width: 1px 0 1px 0;
}

div.miniCalendar table th,
div.miniCalendar table td {
  text-align: center;
}

div.miniCalendar table th {
  padding: 3px;
}

div.miniCalendar table td {
  padding: 0;
}

div.miniCalendar table td em {
  font-style: italic;
  font-weight: bold;
}

div.miniCalendar table td a {
  padding: 5px;
  display: block;
  text-decoration: none;
  color: #444;
}

div.miniCalendar table td a:hover {
  text-decoration: underline;
}

div.miniCalendar table td.disabled a {
  color: #bbb;
}

div.miniCalendar table td.weekend {
  background-color: #ddd;
}

div.miniCalendar table td.today {
  background-color: #DFEBD3;
  font-weight: normal;
}

/* End MiniCalendar */

div#headerRight h3 {
  font-size: 12px;
}

a.learnmore {
  display: block;
  padding: 5px;
  border: 1px solid #666;
  background-color: #8CB8DD;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  float: right;
}
address span {
  line-height: 17px;
}
address span.city, address span.state, address span.postal {
  display:inline;	
}
address span.line1, address span.line2, address span.country { display:block; }
address span.postal { margin-left:10px; }
address span.postal { margin-left:10px; }


.scrollable {
	border:1px solid #666;
  border-bottom-color: #efefef;
  border-right-color: #efefef;
  overflow: scroll;
  padding:10px;
  background-color:white;
}
.smallIcon {
	width:16px;
	height:16px;
	background-repeat:no-repeat;
	cursor: pointer;
	float:left;
	margin-right:6px;
}
.removeIcon { background-image: url(../images/trash_icon.gif); }
.defaultIcon { background-image: url(../images/icons/bookmark.png); }
.editIcon { background-image: url(../images/icon_edit.png); }

/* Styles for forgotPassword.jsp */
#forgotPassword {
  margin-top: 10px;
  text-align: center;	
}
#passwordWrapper {
  width: 300px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
  padding: 20px;
  font-size: 14px;
  background-color: #ffffff;
  border: 5px solid #152F37;
}
#passwordUserMessage {
  width: auto;
  float: left;
  text-align: left;
}
#passwordEnterUser {
width: 150px;
float: left;
padding-top: 4px;
text-align: left;
}
#passwordEnterUser_field {
width: 150px;
float: left;
text-align: left;
}
#passwordEnterUserSubmit {
width: auto;
height: 20px;
padding-top: 10px;
clear: both;
text-align: center;
}
div.termsAndConditions{
  height: 150px;
  overflow: auto;
}



/* Deprecated - DO NOT USE THESE CLASSES!  DO NOT ADD NEW CODE TO THIS! (feel free to remove code, though) */

.oddrow, tr.oddrow {
  background-color: #E6E6E6;
  padding: 2px;
}

a.buttontext {
  text-decoration: none;
}

a.buttontext:hover {
  color: #FF0000;
}

.buttontextdisabled {
  text-decoration: none;
  color: #333333;
}

a.lightbuttontext {
  text-decoration: none;
}

a.lightbuttontext:hover {
  color: #00FF00;
}

.lightbuttontextdisabled {
  text-decoration: none;
  color: #CCCCCC;
}

a.buttontextbig {
  text-decoration: none;
  color: #0000FF;
}

a.buttontextbig:hover {
  color: #FF0000;
}

.thindarkline{
  background: #000000;
}

.i18nButtons,td.i18nButtons,a.i18nButtons,a.i18nButtons:link,a.i18nButtons:visited,a.i18nButtons:active{
     font-size:11px; 
     color:#000000; 
     text-decoration:none; 
     background-color:#dddddd;
     border-top: 1px solid #eeeeee;
     border-left: 1px solid #eeeeee;
     border-bottom: 1px solid #666666;
     border-right: 1px solid #666666;
}

hr.sepbar {
  width: 100%;
  height: 1px;
  border-width: 0px;
  background: #999999;
}

.inputLabel {
    float:       left;
    width:       200px;
    height:      30px;
    line-height: 30px;
    text-align:  left;
}

.inputField {
    float:       left;
    width:       400px;
    height:      30px;
    line-height: 30px;
    text-align:  left;
}

.inputField input, .inputField select {
    margin-top: 5px;
}

.pageTitle {
  font-size: 12pt;
  font-weight: bold;
}


.sectionTitle {
    padding:    3px;
    font-size: 14px;
    font-weight: bold;
    text-align:    left;
    margin-bottom: 5px;
}

.title, .title a, td.title, a.title,  a.title:link, a.title:visited, a.title:active, body.title {
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  background: #a0c75f;
}

th.title, th.title a {
  font-size: 11px;  
}
th.title a {
  color: white;
}

a.title, a.title:link, a.title:visited, a.title:active {
  color: #fff;
}

a.title:hover {
  text-decoration: underline;
}

.title img {
  vertical-align: middle;
}

.titleonbackgroundcolor, td.titleonbackgroundcolor, div.titleonbackgroundcolor {
  color: #000000;
  font-size: 13px;
}

a.titleonbackgroundcolor, a.titleonbackgroundcolor:link, a.titleonbackgroundcolor:visited, a.titleonbackgroundcolor:active {
  text-decoration: none;
  font-size: 13px;
}


  
.boxhead {
  margin: 0px;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 12px;
}

.boxoutside {
  padding: 0px;
  background: #000000;
}

.boxtop {
  color: #FFFFFF;
  text-decoration: none;
  padding: 4px;
  border-color: #000000;
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  font-size: 12px;
  background: #BDBBEC;
}

.boxbottom {
  padding: 4px;
  border-color: #000000;
  border-style: solid;
  border-width: 0px 1px 1px 1px;
  background: #FFFFFF;
}



.calendarbutton, td.calendarbutton, a.calendarbutton, a.calendarbutton:link, a.calendarbutton:visited, a.calendarbutton:active {
  color: #000000;
  text-decoration: none;
  font-size: 11px;
  background: #dddddd;
}

#tabbedContent td.title {
  text-align:center;	
} 
#scheduledTasksAndEventsTable {
	width:100%;
}
/* End of Deprecated */