/**
 * File: marketer.css
 * Description:
 *  This contains Marketer-specific styling details. Any multi-product component styling DOES NOT
 * go here. The Marketer application inherits css styles from spcommon-ui and webhost projects.
 */


/************************************************************************************/
/*****      General styles used throughout the application     **********************/
/************************************************************************************/

body, td, li {
    font-family:            Verdana, Arial, Helvetica, sans-serif;
    font-size:              11px;
}

/* Style used in body tag to get rid of disabled vertical scrollbar when not needed in IE. */
/* Used in login.jsp, messageOfTheDayContent.jsp, and mainLayout.jsp.                      */
.bodyOverflow {
    overflow: auto;
}

/* Styles for accessing the header table (that contains the gwt menu), and the bottom logo img beside the menu */
table#menuTable {
	margin-top: 0px;
}

img#headerLogoBottom {}

/***
 * Text-based classes used to "color" words.
 * As of 7.0, this is only used in preview, but perhaps should be expanded.
 **/

.textBlue {
	font-weight: bold;
	color: blue;
}

.textGreen {
	font-weight: bold;
	color: green;
}

.textRed {
	font-weight: bold;
	color: red;
}

.textYellow {
    font-weight: bold;
    color: yellow;
}

.textPurple, .textPurple:link, .textPurple:visited {
	font-weight: bold;
	color: purple;
}

.textGold {
    font-weight: bold;
    color: #DAA520;
}

.textBlack {
	font-weight: bold;
	color: black;
}

.info {
    color:#6699CC;
}

.important {
    color:#FF0000;
}   /* important text color */

.disabled {
    color:#999999;
}   /* disabled text color */

/**********************************************************************************
 *  Content wrapper classes
 */

.contentWrapper {
    padding:                5px 20px !important;
}

.reportingNewWrapper {
    padding:    0px;
    height:     1px; /* It's a placeholder and really doesn't matter what value it's set to. 
                      * However, 100% results in a vertical scrolbar flashes and disappears,
                      * which leaves an empty space.
                      */
}

/**********************************************************************************
 *  FOLDER BAR classes
 */

A.folderBarNormal {
    color:                  #000000;
    text-decoration:        none;
    line-height:            15px;
    padding:                3px 6px 1px 2px;
}

A.folderBarSelected {
    color:                  #000000;
    text-decoration:        none;
    background-color:       #FFFFFF;
    line-height:            15px;
    padding:                3px 6px 1px 2px;
}

A.folderBarNormal:hover {
    color:                  #FFFFFF;
}

.folderBar {
    background-color:       #CCCCCC;
}

.folderBarIcon {
    padding:                0px 0px 0px 8px;
}

.folderBarUnderlineLight {
    background-color:       #999999;
}

.folderBarUnderlineDark {
    background-color:       #000000;
}


/**********************************************************************************
 *  HR classes
 */

HR {
    height:                 1px;
}

HR.solid1 {
    border-top:             1px solid #97AED3;
}

HR.solid3 {
    border-top:             1px solid #868686;
}

HR.dashed1 {
    border-top:             1px dashed #899DDD;
}

HR.dotted1 {
    border-top:             1px dotted #899DDD;
}


/**********************************************************************************
 *  ACTION BAR / BUTTON classes
 */
/** TODO: Check to see which of these buttons are truly needed! **/
#actionButtonSelectQueryList,
#actionButtonSelectOtherList,
#actionButtonSelectTemplates,
#actionButtonSelectStoredFiles,
#actionButtonSelectMailings,
#actionButtonSelectSeedList,
#actionButtonReportOnlyFolder,
#actionButtonSharedSiteAccessFolder,
#actionButtonHTML,
#actionButtonTEXT,
#actionButtonImportFile,
#actionButtonTagLib,
#actionButtonImport,
#actionButtonContentRefresh,
#actionButtonHyperlinkRefresh,
#actionButtonBrowseAttachments,
#actionButtonGetAttachments,
#actionButtonRemoveAttachments,
#actionButtonAddAttachments,
#actionButtonSave,
#actionButtonSaveAs,
#actionButtonPreview,
#actionButtonSend,
#actionButtonSendTest,
#actionButtonAutomate,
#actionButtonOrgAdminDeleteApprovalGroup,
#actionButtonOrgAdminAddApprovalGroup,
#actionButtonStandardDeleteApprovalGroup,
#actionButtonStandardAddApprovalGroup,
#actionButtonAdd,
#actionButtonRemove,
#actionButton {
    margin:                 0px 2px 0px 2px;
}

.actionButtonNormal {
    color:                  #FFFFFF;
    background-color:       #1B2E73;
    border:                 2px outset #88A2CC;
    padding:                2px 8px 2px 8px;
}

.actionButtonNormal:hover {
    color:                  #FFFFFF;
}

.actionButtonNormalPressed {
    color:                  #FFFFFF;
    background-color:       #1B2E73;
    border:                 2px inset #88A2CC;
    padding:                3px 7px 1px 9px;
}

.actionButtonNormalPressed:hover {
    color:                  #FFFFFF;
}

.actionButtonAlt {
    color:                  #FFFFFF;
    background-color:       #858585;
    border:                 2px outset #FFFFFF;
    padding:                2px 8px 2px 8px;
}

.actionButtonAlt:hover {
    color:                  #FFFFFF;
}

.actionButtonAltPressed {
    color:                  #FFFFFF;
    background-color:       #858585;
    border:                 2px inset #FFFFFF;
    padding:                3px 7px 1px 9px;
}

.actionButtonAltPressed:hover {
    color:                  #FFFFFF;
}

.actionButtonSelected {
    color:                  #FFFFFF;
    background-color:       #6D85B7;
    border:                 2px outset #FFFFFF;
    padding:                2px 8px 2px 8px;
}

.actionButtonSelected:hover {
    color:                  #FFFFFF;
}

.actionButtonSelectedPressed {
    color:                  #FFFFFF;
    background-color:       #6D85B7;
    border:                 2px inset #FFFFFF;
    padding:                3px 7px 1px 9px;
}

.actionButtonSelectedPressed:hover {
    color:                  #FFFFFF;
}

.actionButtonDisabled {
    color:                  #686868;
    background-color:       #CFCFCF;
    border:                 2px outset #FFFFFF;
    padding:                2px 8px 2px 8px;
    cursor:                 not-allowed;
}

.actionButtonDisabled:hover {
    color:                  #686868;
}

.actionBox,
.actionBoxDisabled,
.actionBoxDisplay {
    font-family:            Verdana, Arial, Helvetica, sans-serif;
    font-size:              13px;
    color:                  #000000;
}

.actionBox optgroup {
    color: #b2b2b2;
    font-size: 10px;
    font-style: normal;
    font-weight: normal;
}

.actionBox optgroup option {
    font-family:            Verdana, Arial, Helvetica, sans-serif;
    font-size:              13px;
    color:                  #000000;
}

.actionBoxDisabled {
    background-color:       #D4D0C8;
}

.actionBoxDisabledBorder {
    border-color:           #D4D0C8;
}


.actionBoxDisplay {
    font-size:              11px;
    border-width:           0px;
    margin-left:            -1px;
    background-color:       transparent;
}

/** TODO: Refactor this one out. Only has 7 usages. */
.actionButton {
    font-family:            Verdana, Arial, Helvetica, sans-serif;
    font-size:              11px;
    color:                  #FFFFFF;
    background-color:       #1B2E73;
    height:                 21px;
    border-color:           #88A2CC;
    cursor:                 pointer;
    margin:                 0px 2px 0px 2px;
}


/**********************************************************************************
 *  Specialty classes
 */

.note {
    font-size:              9px;
}

.noteDisabled {
    font-size:              9px;
    color:                  #999999;
}

.importantBold {
    color:                  #EE0000;
    font-family:            verdana, arial, sans-serif;
    font-style:             normal;
    font-weight:            bold;
}

.error,
.errormsg,
.requiredFieldColor,
.errorfield,    
.important {
    color:                  #EE0000;
}

.errormsg {
    font-family:            verdana, arial, sans-serif;
    font-size:              10px;
    font-weight:            normal;
    font-style:             normal;
    padding:                0px 10px 10px 10px;
    background-color:       transparent;
}

.errorfield {
    border: 1px solid #EE0000;
}

.archiveStatus,
.archiveAlert  {
    font-family:            verdana, arial, sans-serif;
    font-size:              12px;
    font-weight:            normal;
    font-style:             normal;
    padding:                0px 10px 10px 40px;
    background-color:       transparent;
}

.archiveAlert {
    color:                  #EE0000;
}


.sectionHeader {
    color:                  #1B2E73;
    font-weight:            bold;
}

.sectionSubContainer {
    padding: 8px 10px;
    border: 1px solid #A0B0D9;
    background: #EEEEEE;
}

.mockDojoPane {
    border: 1px solid #A0B0D9;
}


/**********************************************************************************
 *  Window Popup classes
 */

.popupPageWrapper {
    background-color:       #DCDCDC;
}

.popupDialogBody {
    background-color:       #EBEBEB;
}

.popupTitleBar {
    background-color:       #E4EBF5;
    padding:                5px 6px 6px 8px;
    font-family:            Verdana, Arial, Helvetica, sans-serif;
    font-size:              11px;
}

.popupFolderBar {
    border:                 1px inset #FFFFFF;
    background-color:       #939393;
}

.popupFolderWrapper {
    position:               relative;
    width:                  84px;
    height:                 77px;
}

#popupFolderOverlay {
    position:               absolute;
    top:                    0px;
    left:                   0px;
    width:                  100%;
    height:                 100%;
    z-index:                2;
}

.popupFolderOverlayOn {
    border-width:           1px;
    border-style:           outset;
    border-color:           #FFFFFF #000000 #000000 #FFFFFF;
}

.popupFolderOverlayOff {
    border:                 0px outset #FFFFFF;
}

.popupFolderOverlaySelected,
.popupFolderOverlayPressed {
    border:                 1px inset #FFFFFF;
}

.popupFolderContent {
    position:               absolute;
    top:                    0px;
    left:                   0px;
    width:                  100%;
    height:                 100%;
    color:                  #FFFFFF;
    text-align:             center;
    z-index:                1;
}

.popupFolderContent IMG {
    margin:                12px 0px 5px 0px;
}

.popupHeaderBar {
    color:                  #FFFFFF;
    font-size:              13px;
    font-weight:            bold;
    padding-left:           7px;
    background-color:       #939393;
    height:                 22px;
}

.popupContentWrapper {
    padding:                1px 5px 0px 4px;
}

.popupBreadcrumbBar {
    height:                 24px;
}

.popupBreadcrumbContent {
    padding:                0px 5px 0px 5px;
    color:                  #999999;
}

TD.popupBreadcrumbContent A {
    color:                  #010199;
}

.popupBreadcrumbSelected {
    color:                  #000000;
}

.popupDataGridContainer {
    border:                 2px inset #FFFFFF;
    vertical-align:         top;
}

.popupErrorContainer {
    background-color:       #FFFFFF;
    border:                 2px inset #FFFFFF;
    padding:                10px 10px 10px 10px;
    color:                  #EE0000;
    vertical-align:         top;
}

.popupButtonBar {
    text-align:             right;
    padding:                5px;
}


TD.popupDialogHeader {
    height:                 34px;
    vertical-align:         middle;
    padding-left:           15px;
    color:                  #000000;
    background-color:       #E4EBF5;
}


DIV#popupDialogHeader {
    position:               absolute;
    top:                    0px;
    left:                   0px;
    padding:                10px 15px 11px 15px;
    color:                  #000000;
    background-color:       #E4EBF5;
    display:                block;
    border-bottom:          1px #FFFFFF solid;
    width: 100%;
}

DIV#emptyPopupDialogContent {
    position:               absolute;
    display:                block;
}

DIV#popupConfirmationText {
    position:               absolute;
    top:                    0px;
    left:                   0px;
    padding:                10px 15px 11px 15px;
    color:                  #000000;
    background-color:       #E4EBF5;
    display:                block;
}


DIV#popupDialogErrorSoft {
    position:               absolute;
    top:                    34px;
    left:                   0px;
    padding:                4px 15px 4px 15px;
    visibility:             hidden;
    display:                block;
}

DIV#popupDialogErrorHard {
    position:               absolute;
    top:                    10px;
    left:                   0px;
    padding:                0px 15px 0px 15px;
    width:                  auto;
    height:                 65px;
    overflow:               auto;
    display:                none;
}

DIV#largePopupDialogErrorHard {
    position:               absolute;
    top:                    10px;
    left:                   0px;
    padding:                0px 15px 0px 15px;
    width:                  auto;
    overflow:               auto;
    display:                none;
}

DIV#popupDialogEntryFields {
    position:               absolute;
    top:                    55px;
    left:                   0px;
    display:                block;
}

DIV#popupDialogButtons {
    position:               absolute;
    top:                    87px;
    left:                   0px;
    width: 100%;
}

DIV#popupDialogButtons2 {
    position:               absolute;
    bottom:                 0px;
    right:                  55px;
}

.popupDialogErrorText {
    color:                  #EE0000;
}

/**********************************************************************************
 *  Info classes
 */

.infoHeader {
    background-color:       #E4EBF5;
    padding:                10px 20px 12px 20px;
}

.infoBoxContainer {
    border:                 1px solid #6D85B7;
}

.infoBoxHeader {
    background-color:       #88A2CC;
    padding:                0px 6px;
    height:                 24px;
}

.infoBoxHeaderText {
    color:                  #FFFFFF;
    padding:                0px 6px;
}

.infoBoxContent {
    background-color:       #EFF3F9;
    padding:                4px 12px;
}

.infoBoxContentAltText {
    color:                  #1B2E73;
}

.infoBoxContent UL {
    margin:                 6px 20px;
}

.infoBoxContent LI {
    margin:                 0px;
    padding:                4px 0px;
}

/**********************************************************************************
 *  Calendar classes
 */

.calendarBody {
    margin:                 5px;
}

.calendarContainer TD,
.calendarHeader TD,
.calendarWeekday TD,
.calendarWeekend TD,
.calendarSelected TD {
    color:                          #FFFFFF;
}

.calendarContainer {
    background-color:               #1B2E73;
}

.calendarNavYearPrev,
.calendarNavYearNext,
.calendarNavMonthPrev,
.calendarNavMonthNext {
    padding:                        0px 2px;
    background-repeat:              no-repeat;
    background-position:            center center;
}

.calendarNavYearPrev {
    background-image:               url(../images/icon_calendar_year_prev_blue.gif);
}

.calendarNavYearNext {
    background-image:               url(../images/icon_calendar_year_next_blue.gif);
}

.calendarNavMonthPrev {
    background-image:               url(../images/icon_calendar_month_prev_blue.gif);
}

.calendarNavMonthNext{
    background-image:               url(../images/icon_calendar_month_next_blue.gif);
}

.calendarHeader {
    background-color:               #88A2CC;
}

.calendarWeekday {
    background-color:               #FFFFFF;
}

.calendarWeekend {
    background-color:               #E3EBF5;
}

.calendarSelected {
    font-weight:                    bold;
    background-color:               #EC7411;
}

.calendarSelected A,
.calendarSelected A:hover {
    color:                          #FFFFFF;
}


/* --------------- */
/* section classes */
/* --------------- */

.sectionHeader {
    color:#000000;
    font-size:18px;
    font-weight:bold;
}   /* bolded section header */

.sectionSubHeader
{
    color:#000000;
    font-size:11px;
    font-weight:bold;
    padding-bottom: 4px;
}   /* bolded section header */

.sectionBoxHeader {
    color:#FFFFFF;
    background-color:#6699CC;
    font-size:11px;
    font-weight:bold;
}   /* section box header with background-color */

.sectionBoxContent {
    color:#000000;
    background-color:#EAE9B5;
}   /* background-color for section box content area */

.sectionBoxBorder {
    background-color:#EAE9B5;
}   /* background-color for section box content area */


/* ------------------------- */
/* data table layout classes */
/* ------------------------- */

.columnHeaderLeft {
    color:#000000;
    background-color:#CCCC99;
    height:20px;
}   /* default left-aligned table column header */

.columnHeaderLeftSelected {
    color:#000000;
    background-color:#999966;
    height:20px;
}   /* selected left-aligned table column header */

.columnHeaderCenter {
    color:#000000;
    background-color:#CCCC99;
    text-align:center;
    height:20px;
}   /* default centered table column header */

.columnHeaderCenterSelected {
    color:#000000;
    background-color:#999966;
    text-align:center;
    height:20px;
}   /* selected centered table column header */

.columnHeaderRight {
    color:#000000;
    background-color:#CCCC99;
    text-align:right;
    height:20px;
}   /* default right-aligned table column header */

.columnHeaderRightSelected {
    color:#000000;
    background-color:#999966;
    text-align:right;
    height:20px;
}   /* selected right-aligned table column header */

.altColumnHeaderLeft {
    color:#000000;
    background-color:#CCCCCC;
    height:20px;
}   /* alt left-aligned table column header */

.altColumnHeaderLeftSelected {
    color:#000000;
    background-color:#999999;
    height:20px;
}   /* alt selected left-aligned table column header */

.altColumnHeaderCenter {
    color:#000000;
    background-color:#CCCCCC;
    text-align:center;
    height:20px;
}   /* alt centered table column header */

.altColumnHeaderCenterSelected {
    color:#000000;
    background-color:#999999;
    text-align:center;
    height:20px;
}   /* alt selected centered table column header */

.altColumnHeaderRight {
    color:#000000;
    background-color:#CCCCCC;
    text-align:right;
    height:20px;
}   /* alt right-aligned table column header */

.altColumnHeaderRightSelected {
    color:#000000;
    background-color:#999999;
    text-align:right;
    height:20px;
}   /* alt selected right-aligned table column header */

.tableDataNormal {
    color:#000000;
    background-color:#FFFFFF;
    padding:4px 10px 4px 10px;
}   /* normal table data row */
.tableDataNormalNoPad {
    color:#000000;
    background-color:#FFFFFF;
}   /* normal table data row */

.tableDataNormalDisabled {
    color:#999999;
    background-color:#FFFFFF;
    padding:4px 10px 4px 10px;
}   /* normal table data row */

.tableDataShaded {
    color:#000000;
    background-color:#EEEEEE;
    padding:4px 10px 4px 10px;
}   /* shaded table data row */

.tableHeaderFooter {
    background-color:#EEEEEE;
    padding:4px 10px 4px 10px;
}   /* table header and footer attributes */

.tableDataNormalLtPad {
    color:#000000;
    background-color:#FFFFFF;
    padding:2px 10px 2px 10px;
}

.tableDataNormalXLtPad {
    color:#000000;
    background-color:#FFFFFF;
    padding:0px 10px 0px 10px;
}

/************************************************************************************/
/******************** CUSTOM STYLES *************************************************/
/************************************************************************************/

/**
 * Please note:
 *  The best effort was made at placing the following styles in a semi-logical order
 *  according to the flow of the application.
 *  The order:
 *    Header/navigation
 *    Login
 *    Home page
 *    Lists
 *    Mailings
 *      - DC, preview
 *    Campaigns
 *    Reports
 *    Resources
 *    Settings
 *      - user, organization, system
 **/



/**********************************************************************************
 *  HEADER BAR classes - look in SPHeader.css
 */


/**********************************************************************************
 *  Login Table classes
 */
TABLE.loginTable {
    background-image:       url("../images/login_grey.jpg");
    background-repeat:      no-repeat;
    height:	    			100%;
}

TD.loginVerbiageLogo {
    background-image:       url("../images/login.gif");
    background-repeat:      no-repeat;
    background-position:    center left;
    background-color:       #283D7F;
    height:					27px;
}

TD.loginTitle {
    background-image:       url("../images/login_dots.gif");
    background-repeat:      no-repeat;
    background-position:    center bottom;
    font-weight:            bold;
    color:                  #0066cc ! important;
    font-family:            Verdana, Arial, Helvetica, sans-serif;
	font-size:              12px;
    height:                 40px;
}

TD.loginLogo {
    background-image:       url("../images/Login_header_top.gif");
    background-repeat:      no-repeat;
    background-position:    center left;
    width:                  217px;
    height:					30px;
}

TD.loginForm
{
    /*background-image:       url("../images/Login_background_slice.gif");*/
    /*background-repeat:      repeat-y;*/
    height:                 100%;
    width:                  217px;
}

TD.loginBottomBorder {
    background-image:       url("../images/Login_rounded_bottom.gif");
    background-repeat:      no-repeat;
    background-position:    top left;
    width:                  217px;
    height:					9px;
}


/********************************************************
 ** Start navigational bars used on EVERY screen
 **/
A.topNav {
	color:#FFFFFF;
    text-decoration:none;
}   /* text link color for navigation links */

A.sideNav {
    color: #000000;
    text-decoration:none;
}   /* text link attributes for side navigation links */

A.tableNav {
    text-decoration:none;
}   /* text link attributes for table navigation links */

A.tableNav:hover {
    color:#000099;
    background-color:#FFFFFF;
}   /* text link attributes for table navigation links onMouseOver */

A.tableNav2:hover {
    color:#000099;
}   /* text link attributes for table navigation links onMouseOver */

/**********************************************************************************
 *  TOP NAV classes
 */
A.navTop {
    color:                  #E9EFF9;
    font-weight:            bold;
    text-decoration:        none;
}

A.navTop:hover {
    color:                  #C4DCFF;
}

TD.navTopLight {
    background-color:       #88A2CC;
}

TD.navTopMedium {
    background-color:       #576FA9;
}

TD.navTopDark {
    background-color:       #1B2E73;
}

TD.navTopUnderlineLight {
    background-color:       #999999;
}

TD.navTopUnderlineDark {
    background-color:       #000000;
}

TD.navTopContentNormal {
    background-color:       #1B2E73;
    line-height:            9px;
    padding:                3px 9px 6px 8px;
}

TD.navTopContentSelected {
    background-color:       #576FA9;
    line-height:            9px;
    padding:                3px 9px 6px 8px;
}

TD.topAlign {
    vertical-align: top;
}

/***********************************************************************************
 *  TOP SUB NAV classes
 */
A.navTopSubLinkDisabled {
    color:                  #BBBBBB;
    text-decoration:        underline;
}

A.navTopSubLinkNormal {
    color:                  #000099;
    text-decoration:        underline;
}

A.navTopSubLinkSelected {
    color:                  #FFFFFF;
    font-weight:            bold;
    text-decoration:        none;
}

A.navTopSubLinkNormal:hover {
    color:                  #FF6701;
}

A.navTopSubLinkSelected:hover {
    color:                  #C4DCFF;
}

.navTopSubContainer {
    color:                  #999999;
    background-color:       #EEEEEE;
}

.navTopSubNormal {
    padding:                0px 7px 0px 7px;
    vertical-align:         middle;
    height:                 24px;
}

.navTopSubSelected {
    padding:                0px 14px 0px 14px;
    vertical-align:         middle;
    background-color:       #6D85B6;
    height:                 24px;
}

.navTopSubSeparator {
    padding:                0px 0px 0px 0px;
    vertical-align:         middle;
    height:                 24px;
}
/** End navigational bars used on EVERY screen **/

/**********************************************************************************
 *  News Bar classes (look in newsBar.jsp)
 */

.newsBar {    
    background: #000000 url(../images/top_nav_slice.gif) left bottom repeat-x;
    height: 31px;
    z-index: 950;
}

.newsBar TD {
    padding:                0px 0px 0px 20px;
}

.newsBarInfo {
    margin-top:             3px;
    width:                  100%;
    color:                  #ffffff;
    overflow:               hidden;
    white-space:            nowrap;
    font-family:            Verdana, Arial, Helvetica, sans-serif;
	font-size:              11px;
	height:                 20px;
    float:                  left;
    padding-top:            5px;
}

.newsBarInfo A, .newsBarInfo A:hover, .newsBarInfo A:visited  {
    color:                  #ffffff;
    text-decoration:        underline;
}


/*************************
 HOME PAGE
 **/
.homelinks {
    list-style-image: url( '../images/frame_bullet.gif' );
    margin: 0px;
    padding: 0px;
    margin-top: 10px;
    margin-left: 20px;
    font-size: 11px;
}

table.homeLinks {
    border: 1px solid #e8ecf6;
    border-top:0px;
    font-size:12px;
    color: #666666;
    font-family:Arial, Helvetica, sans-serif;
}
table.homeLinks tr td.borderRight {
    border-right:solid 1px #e8ecf6;
    padding:10px 5px 5px 5px;    
}

.homelinks li {
    align: absmiddle;
    margin-top: 5px;
}


/************************************************************************
 * LISTS
 **/
.segmentingContainer {
    border:                 1px solid #CCCCCC;
}

.segmentingHeader {
    background-color:       #88A2CC;
    height:                 24px;
    color:                  #FFFFFF;
    padding:                0px 6px;
    border-bottom:          1px solid #CCCCCC;
}

.segmentingSubHeader {
    background-color:       #E4EBF5;
    padding:                10px;
    border-bottom:          1px solid #CCCCCC;
}



/************************************************************************
 * MAILINGS
 **/

/*
 *  OLD-STYLE TABS classes (these are the non-ajaxed tabs which currently only applies
 *  to the mailings page.
 */
A.tabText {
    color:                  #000000;
    text-decoration:        none;
}

A.tabTextGreen:hover, A.tabTextBlack:hover {
    color: #0000FF;
	text-decoration: underline;
}

A.tabTextBlack, A.tabTextBlack:visited {
    color:                  #666666;
}

A.tabTextGreen, A.tabTextGreen:visited {
    color:                  green;
    text-decoration:        underline;
}

A.tabText:hover {
    color:                  #FFFFFF;
}

A.outsideTabText {
    color:                  #010199;
}

A.outsideTabText:hover {
    color:                  #FF6701;
}

.tabNormal,
.tabSelected,
.tabDisabled {
    padding:                0px 7px 0px 12px;
    line-height:            12px;
}

.tabNormal,
.tabNormalAlt {
    background-color:       #A4A4A4;
}

.tabSelected,
.tabSelectedAlt {
    background-color:       #CCCCCC;
}

.tabDisabled,
.tabDisabledAlt {
    color:                  #999999;
    background-color:       #EFEFEF;
}

/**
 * Mailing compose
 **/
table.compose_spForm tr td,
table.compose_spForm tr th,
table.compose_spForm tr td.input,
table.compose_spForm tr td.label,
table.compose_spForm tr td.blue {
    padding: 4px;
    vertical-align: middle;
}

table.compose_spForm tr td label {
    padding-top: 3px;
    width: 20%;
    text-align: right;
}

span.composeSelectListDisabledList {
    color: #666666;
}

/**
 * Styles used by both mailing and reports for tracking data
 **/
.testMailingStyle {
    font-style: italic;
}

.normalMailingStyle {
    font-style: normal;
}

.trackingDisplayContainer {
    border-width:           2px;
    border-style:           inset;
    border-color:           #FFFFFF;
    height:                 400px;
}

.trackingExpiredStyle {
    font-size: 11px;
    font-weight: bold;
    color: #FF0000;
}

/**
* Styles used by Query and Dynamic Content criteria builders
*/
.criteria{
	border:1px solid #BFBFBF;
	border-top:0px;
	font-weight:normal;
	background-color:#ffffff;
}
.criteria th{
	background-image:url('../images/criteria_header_bkg.png');
	background-repeat: repeat-x;
	background-position:bottom;
	border-right: 1px solid #BFBFBF;
	font-weight:normal;
	font-size: 11px;
}

/*/***/
 /** DYNAMIC CONTENT*/
 /** This is the start of styling related to the new Dynamic Content look.*/
 /** Start.*/
 /**/
/*.dc_container{*/
	/*background-color:#EBEBEB;*/
	/*border:1px solid #888888;*/
    /*margin: 0px;*/
    /*padding: 0px;*/
/*}*/
/*p #dc_paragraph {*/
    /*padding: 0px;*/
    /*margin: 0px 0px 10px 0px;    */
/*}*/
/*#dc_instructions{*/
	/*line-height:16px;*/
	/*padding:5px 10px 5px 10px;*/
	/*border-top:1px dashed #000000;*/
	/*height: 55px;*/
/*}*/
/*.dc_ruleset_container{*/
	/*background-color:#CCCCCC;*/
	/*border:1px solid #9D9D9D;*/
	/*padding: 5px 5px 0px 5px;*/
    /*overflow-y:auto; *//** Only allow vertical scrolling */
    /*height: 395px;*/
/*}*/
/*.dc_rule_container_box{*/
    /*width:753px;*/
    /*border:1px solid #BFBFBF;*/
	/*border-top:1px solid #EAEAEA;*/
	/*margin-bottom: 10px;*/
/*}*/
/*.dc_rule_heading_open {*/
    /*background-image:url('../images/alert_header_bkg.png');*/
/*}*/
/*.dc_rule_heading{	*/
    /*background-color:#EBEBEB;*/
    /*background-repeat: repeat-x;*/
	/*border-bottom:0px;*/
	/*color:#003366;*/
	/*font-weight:bold;*/
	/*height:28px;*/
/*}*/
/*.dc_rule_body_container{*/
	/*background-color:#FFFFFF;*/
	/*font-weight:normal;*/
	/*padding:0px 4px;*/
/*}*/

/*.dc_green_label {*/
    /*color:#339900;*/
/*}*/

/*.dc_rule_summary,*/
/*.dc_rule_footer{*/
	/*background-color:#EBEBEB;*/
	/*padding:5px 5px 5px 10px;*/
    /*border-bottom: 0px solid #ffffff;*/
/*}*/

/*.dc_rule_criteria_summary {*/
    /*font-weight: bold;*/
    /*background-color:#EBEBEB;*/
    /*padding:5px 5px 5px 10px;*/
    /*border-bottom: 0px solid #ffffff;    */
/*}*/
/*.dc_rule_summary_header {*/
    /*border: 0;*/
    /*padding: 0;*/
    /*margin: 0;*/
    /*border-collapse: collapse;*/
    /*width: 750px;*/
    /*vertical-align: middle;*/
/*}*/

/*.dc_rule_summary_header tr td {*/
    /*border: 0;*/
    /*padding: 0;*/
    /*margin: 0;*/
    /*font-weight: bold;*/
    /*vertical-align: middle;*/
/*}*/

/*.dc_rule_edit_link {*/
    /*font-weight: normal;*/
/*}*/

/*.dc_container h1{*/
	/*text-transform:uppercase;*/
	/*margin: 5px 5px 15px 5px;*/
	/*color:#339900;*/
	/*font-size: 16px;*/
/*}*/



/** For invalid placeholders in the wysiwyg **/
/*.dcInvalid {*/
	/*padding: 2px;*/
	/*border: 2px solid red;*/
	/*background-color: #EFEFEF;*/
	/*color: black;*/
/*}*/

/*#expand_close_all{*/
	/*padding-bottom:10px;*/
/*}*/
/*.grey_blue_container{*/
	/*border:1px solid #BFBFBF;*/
	/*border-top:1px solid #EAEAEA;*/
/*}*/
/*.grey_container{*/
	/*background-color:#EBEBEB;*/
	/*border:1px solid #FFFFFF;*/
	/*padding:10px 10px 15px 10px;*/
/*}*/


/*.white_blue_heading_text{*/
	/*text-align:left;*/
	/*padding: 5px 5px 0px 5px;*/
/*}*/
/*.rule_header_input{*/
	/*margin-top: 2px;*/
	/*width:75%;*/
/*}*/
/*.paren_input{*/
	/*color:#FF0000;*/
	/*width:20px;*/
/*}*/


/*#dc_rulset_details{*/
	/*padding:5px;*/
	/*border-bottom:1px solid #9D9D9D;*/
	/*line-height:16px;*/
/*}*/
/*#dc_save_buttons{*/
	/*float:right;*/
	/*background-image:url('../images/dc_save_bkg.png');*/
	/*background-repeat:no-repeat;*/
	/*width:203px;*/
	/*font-size:9px;*/
	/*padding: 6px 0px 5px 5px;*/
/*}*/
/*#dc_save_buttons a{*/
	/*color:#000000;*/
/*}*/
/*/***/
 /** End - Dynamic Content*/


/*********************
 * LOCKED TEMPLATE
 *********************/



/*********************
 * PREVIEW STYLES
 *********************/
 #previewLeftDiv {
	display:inline; 
	float: left; 
	height:100%;
	width: 69%;
}

#previewRightDiv {
	display:inline; 
	float: right; 
	width: 30%;
	margin: 1px 5px 2px 0px;
	padding: 0px;
	height: 100%;
	overflow-y:auto;
	background-color: #eeeeee;
}

.previewIframe {
	border: 1px solid #000000;
}

.previewModule {
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
	overflow-y: auto;
}

.mailingInfo {
	font-weight: bold;
	color: green;
}

.previewDcHeader {
	font-weight: bold;
	color: #669933;
}

.previewOuterBox {
	margin: 2px;
	padding:2px;
}

.previewInnerBox {
	margin: 5px;
	padding:5px;
}

.previewInnerButton {
	margin: 5px;
	padding: 5px;
	text-align: right;
}

.rulesetInnerBlock {
	margin: 2px;
	padding: 2px;
}

.rulesetOuterBlock {
	margin: 2px;
	padding: 2px;
}

.previewDottedLineContainer {
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 5px;
	padding-bottom: 7px;
}

.noWrap {
    white-space: nowrap;
}

#dcModule {
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
	overflow-y: auto;
}


/**********************************************************************************
 *  Reporting classes
 */

.reportsViewBody {
    background-color:       #DCDCDC;
}

.reportsContentWrapper {
    background-color:       #DCDCDC;
    padding:                27px 20px 27px 20px;
}

.reportsGeneralContainer,
.reportsMultipleMailingsContainer,
.reportsComparisonContainer,
.reportsCampaignContainer,
.reportsSubscriberContainer,
.reportsCustomContainer,
.reportsDisabledContainer,
.reportsArchiveContainer,
.reportsPlainContainer{
    padding:                15px;
}

.reportsGeneralContainer {
    background-color:       #D2DEF0;
}

.reportsCustomContainer {
    background-color:       #DCDCDC;
}

.reportsMultipleMailingsContainer {
    background-color:       #AFAFAF;
}

.reportsComparisonContainer {
    background-color:       #868686;
}

.reportsCampaignContainer {
    background-color:       #6686BB;
}

.reportsSubscriberContainer {
    background-color:       #97AED3;
}

.reportsArchiveContainer {
    background-color:       #1B2E73;
}

.reportsDisabledContainer {
    background-color:       #E8E8E8;
}

.reportsPlainContainer {
    background-color:       #FFFFFF;
}

TABLE.reportsNormal TD {
    color:                  #000000;
}

TABLE.reportsAlternate TD {
    color:                  #DCDCDC;
}

TABLE.reportsDisabled TD {
    color:                  #BEBEBE;
}

TABLE.reportsNormal A {
    color:                  #010198;
}

TD.reportsLink A,
TABLE.reportsDisabled TD.reportsLink {
    font-weight:            bold;
    text-decoration:        none;
}

TD.reportsLinkPlainBlack A,
{
    text-decoration:        none;
    color:                  #000000;
}

TD.reportsLinkPlainBlack A:hover {
    text-decoration:        underline;
    color:                  #000000;
}

TD.reportsLink A:hover {
    text-decoration:        underline;
}

TABLE.reportsNormal TD.reportsLink A {
    color:                  #000000;
}

TABLE.reportsAlternate TD.reportsLink A {
    color:                  #DCDCDC;
}

TABLE.reportsNormal TD.reportsLinkDisabled {
    color:                  #BEBEBE;
    font-weight:            bold;
    text-decoration:        none;
}

TABLE.reportsNormal TD.reportsTextDisabled {
    color:                  #BEBEBE;
}

.reportsActionBar {
    height:                 32px;
    background-color:       #EEEEEE;
    padding:                0px 0px 0px 20px;
}

.reportsActionBar2 {
    height:                 32px;
    background-color:       #E6ECF5;
    padding:                0px 0px 0px 20px;
}

.reportsSummaryBlock {
    background-color:       #FFFFFF;
    padding:                14px 20px 14px 20px;
}

/*************
 REPORTS - TOP DOMAINGS
 **************/
a.titleHtmlLink, a.titleHtmlLink:link, a.titleHtmlLink:active, a.titleHtmlLink:visited {
    color: #0000FF;
    text-decoration: none;
}

a.titleHtmlLink:hover {
    color: #0000FF;
    text-decoration: underline;
}

/*--------------------------------------------------
 /            Helptext Bar                     /
==================================================*/

.helptextBar {
    background-image: url( '../images/sub_nav_blue_slice.gif' );
    background-repeat: repeat-x;
    background-position: left bottom;
    width: 100%;
}

.helptextBar table {
    padding: 0;
    margin: 0px;
    border-collapse: collapse;
    border-spacing: 0px;
    height: 23px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    font-weight: bold;
    cursor: default;
}

.pillList {
}

.tagPill {
    float: left;
    margin-right: 4px;
    margin-bottom: 4px;
}

.tagPill .left {
    background: url("../images/tagPillLeft.gif") left top no-repeat;
    width: 3px;
    height: 17px;
    float: left;
}

.tagPill .center {
    background: url("../images/tagPillCenter.gif") left top repeat-x;
    height: 17px;                       
    float: left;
    padding: 2px 3px 0px 3px;
    font-size: 10px;
    /*font-weight: bold;*/
    color: #000000;
    white-space: nowrap;
    cursor: pointer;
    cursor: hand;
}

.tagPill .right, .tagPill .rightOver {
    background: url("../images/tagPillRight.gif") top left no-repeat;
    height: 17px;
    width: 15px;
    float: left;
    clear: right;
}

.tagPill .rightOver {
    background-image: url("../images/tagPillRightOver.gif") !important;
    cursor: pointer;
    cursor: hand;
}


/** USED in sys admin, editSMSSettings.jsp - it'd be cool if all the tables did this, instead of the goofy
    align attributes and manual cut/paste layout **/
table.sysAdminFormTable {
}

table.sysAdminFormTable tr td label {
    display: block;
    text-align: right;
}

img.help {
    width: 16px;
    height: 16px;
    border: 0;
    background: url('../images/contextHelp_icon_16.gif') left top no-repeat;
    padding-left: 3px;
}

.helpBubble { z-index: 2000 };

.stepHeader {
    color: #669933;
    font-size: 13px;
    font-weight: bold;
    padding-left: 5px;
}

div.verticalDottedLine {
    background: url('/images/vertical_dots.gif') center center repeat-y;
}

div.disableByOpacity {
    opacity: .40;
    filter: alpha(opacity=40);
}

.sectionHeader {
    color:#669933;
    font-family:Verdana,Arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    padding-right:3px;
    white-space:nowrap;
}

.sectionLabel {
    font-family:Verdana,Arial,sans-serif;
    font-size:11px;
    /*font-weight:bold;*/
    padding-right:3px;
    white-space:nowrap;
}

.campaignAutomationLink a {
    color: #0000FF;
    text-decoration: underline;
    cursor: pointer;
}

.campaignAutomationLinkDisabled a {
    color: #999999;
    text-decoration: none;
    cursor:  default;
}

.textBox-readonly {
    color: #888;
    background-color: #ebebeb;
}

.iconRecipientOptIn16 {
    background-image: url('../images/iconRecipientOptIn16.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconRecipientOptIn16_disabled {
    background-image: url('../images/iconRecipientOptIn16-disabled.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconRecipientStartDate16 {
    background-image: url('../images/iconRecipientStartDate16.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconRecipientStartDate16-disabled {
    background-image: url('../images/iconRecipientStartDate16-disabled.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconRecipientMatches16 {
    background-image: url('../images/iconRecipientMatches16.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconRecipientMatches16-disabled {
    background-image: url('../images/iconRecipientMatches16-disabled.png');
    background-position: center;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin: 0 3px 0 5px;
}

.iconCalendarDisabled {
    background-image: url('../images/icon_calendar_disabled.gif');
    background-position: center;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    /*margin: 0 3px 0 5px;*/
}

.iconCalendar {
    background-image: url('../images/icon_calendar.gif');
    background-position: center;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    /*margin: 0 3px 0 5px;*/
}

/* Password Expiration Warning */
.securityHeader{
    background-color:       #000000;
    height:                 30px;
    width:                  100%;
}

.securityHeaderText{
	color:   #ffffff;
	float:   right;
	margin: 10px 20px 0 0px;
}

.iconListFolder {
    background: url('../images/folder.gif') no-repeat;
}

.iconContactList {
    background: url('../images/static_list_icon_16.gif') no-repeat;
}

/** Static Lists **/
div#selectStaticListDiv h4 {
    display:inline;
    padding-left: 3px;
}

table#staticListTable tbody td.icon, table#staticListGrid tbody th.icon {
    text-align: center;
}

table#staticListTable tbody td.icon img {
    cursor: pointer;
}

table#programsListTable tbody td.icon, table#programListGrid tbody th.icon {
    text-align: center;
}

table#programsListTable tbody td.icon img {
    cursor: pointer;
}

/* Temporary Password */
.password{
    border: 1px solid grey;
    margin: 15px;
    padding: 10px;
    font-family: Times;
    font-size: 22px;
    background-color: #FFFFE0;
    text-align: center;
    letter-spacing: 3pt;
}

/* iframes */
iframe.dialogFrame {
    width: 100%;
    border: 0;
    padding: 0;
    margin: 0;
    background-color: #7F7F7F;
}

/*begin form bubble css*/
div.formBubble {
	position: relative;
    /*display: none;*/
    /*top: 75px;*/
    /*left: 460;*/
	width: 355px;
	/*margin-top: 50px;*/
	font-size: 11px;
	font-family: arial, helvettica, sans-serif;
	color: #000000;
    cursor: pointer;
    cursor: hand;
}

/*div.formBubble div.middle h2 {*/
    /*margin: 0 0 8px 8px;*/
    /*padding: 3px 0 0 0;*/
    /*font-size: 15px;*/
    /*color: #669933;*/
/*}*/

/*div.formBubble div.middle h3 {*/
    /*margin: 0 0 5px 8px;*/
    /*padding: 0;*/
    /*font-size: 12px;*/
    /*color: #999999;*/
/*}*/

div.formBubble div.middle div {
    display: block;
    margin: 0 13px 15px 8px;
    height: 120px;
    overflow: auto;
}

div.formBubble table.bottom tr td.bottomMiddle a.rightLink,
div.formBubble table.bottom tr td.bottomMiddle a.rightLink:hover,
div.formBubble table.bottom tr td.bottomMiddle a.rightLink:active,
div.formBubble table.bottom tr td.bottomMiddle a.rightLink:visited {
    display: block;
    line-height: 10px;
    height: 10px;
    text-align: right;
    color: #3399FF;
    margin: 0;
    padding: 0;
    position: relative;
    top: -25px;
    left: -10px;
    text-decoration: underline !important;
    display: none;
    margin-left: 20px;
}

div.formBubble table tr td {
    padding: 1px;
}

div.formBubble table.top {
    width: 100%;
	height: 10px;
	border: 0;
	margin: 0;
	padding: 0;
	border-collapse: collapse;
	background-color: transparent;
}

div.formBubble table.top tr td.topLeft {
	height: 10px;
    line-height: 10px;
	width: 2px;
	background: url('../images/form_bubble_tl.png') left top no-repeat;
}

div.formBubble table.top tr td.topMiddle {
    height: 10px;
    line-height: 10px;
    background: url('../images/form_bubble_t.png') left top repeat-x;
    background-color: #EEEEEE;
}

div.formBubble table.top tr td.topRight {
	height: 10px;
    line-height: 10px;
	width: 10px;
	background: url('../images/form_bubble_tr.png') left top no-repeat;
}

div.formBubble div.middle {
	position: relative;
	height: 123px; /*Dynamic adjustment via widget*/
	margin-left: 4px;
	margin-right: 10px;
	background-color: #EEEEEE;
}

div.formBubble div.middleLeft {
	position: absolute;
	left: 0px;
	top: 7px;
	height: 126px; /*Dynamic adjustment via widget*/
	width: 4px;
	background: url('../images/form_bubble_l.png') left top repeat-y;
}

div.formBubble div.middleRight {
	position: absolute;
	right: 1px;
	top: 7px;
	height: 126px; /*Dynamic adjustment via widget*/
	width: 10px;
	background: transparent url('../images/form_bubble_r.png') left top repeat-y;
}

div.formBubble table.bottom {
    width: 100%;
    height: 10px;
    border: 0;
    margin: 0;
    padding: 0;
    border-collapse: collapse;
    background-color: transparent;
}

div.formBubble table.bottom tr td.bottomLeft {
    height: 10px;
    line-height: 10px;
    width: 2px;
    background: url('../images/form_bubble_bl.png') left top no-repeat;
}

div.formBubble table.bottom tr td.bottomMiddle {
    height: 10px;
    line-height: 10px;
    background: url('../images/form_bubble_b.png') left top repeat-x;
}

div.formBubble table.bottom tr td.bottomRight {
    height: 13px;
    line-height: 10px;
    width: 10px;
    background: url('../images/form_bubble_br.png') left top no-repeat;
}

div.formBubble div.listSelection {
    border: 1px solid #88A2CC;
    height:125px;
    background-color:#FFFFFF;
    margin: 0 14px 6px 8px;
}

div.leftArrow {  /*Dynamic adjustment via widget*/
	position: absolute;
	left: -17px;
	width: 18px;
	height: 18px;
	top: 33px;
	background: url('../images/form_bubble_arrow.png');
	z-index: 3;
}
/*End form bubble css*/


/* Tweak for the autocomplete dialog to fix the button width in the dojo 1.5.0 upgrade */
.dijitComboBox .dijitButtonNode {
    width: 16px;
}

.dijitComboBoxMenu, .dijitComboBoxMenuHover {
    border: 1px solid #6B9AC6;
    background-color: #ECF0F7;
    /*color: #6B9AC6;*/
    color: #005699;
}

.dijitComboBoxMenuHover .dijitMenuItemSelected {
    background-color: #CAD1E7;
}

.dijitFocused {
    outline: none;
}

/* A/B testing styles */
div.sendForm .oddlySpacedInput {
    margin-bottom: 16px;
}

div.sendForm .line {
    width: 100%;
    margin-bottom: 4px;
}

div.sendForm .line .label {
    width: 192px;
    display: inline-block;
    text-align: right;
    margin-right: 5px;
    #display: inline;
}

div.sendForm .line .input {
    display: inline;
}

div.sendForm .line .testCasesHeader {
    font-weight: bold;
}

div.sendForm .line .labelDescription {
    margin-left: 141px;
}

div.sendForm .abTestCases {
    width: 100%;
}

div.sendForm .abTestCase {
    width: 100%;
    margin-bottom: 6px;
}

div.sendForm .abTestCase .abTestCaseLabel {
    width: 192px;
    display: inline-block;
    text-align: right;
    margin-right: 7px;
    vertical-align: middle;
    #display: inline;
}

div.sendForm .abTestCase .abTestCaseInput {
    display: inline;
    vertical-align: middle;
}

div.sendForm .buttons {
    width: 100%;
    display: inline;
    text-align: right;
    float: right;
}

div.sendForm .dottedLine {
    margin-bottom: 4px;
}

div.sendForm .buttonProgressWrapper {
    width: 100%;
}

div.fauxProgressBar {
    visibility: hidden;
    margin-top: 4px;
}

div.fauxProgressBar .spinner {
    display: inline-block;
    vertical-align: middle;
    margin-right: 7px;
    #display: inline;   
}

div.fauxProgressBar .abText {
    display: inline;
    vertical-align: middle;
    color: #FF0000;
}
/* end A/B testing styles */
