/* standard customization style modifications */


/* $Id: customcss.jsp 47930 2009-02-19 15:36:01Z gparker $ */

body { height: 100%; } /* should move to wamnet.css*/

body, #head, caption, 
#mainColumn h2, #mainBody h2,
#leftColumn h2, #rightColumn h2,
.fText, .fInput, .fButt, .fFile, .fRequired, .fLabel, .links,
.tableNest .fLabel, .tableNest .fText, .tableNest .fInput,
{
	color: #000000;							/* text color for main page content */
}

body,
#head,
#footer, #footerLeft, #footerRight {
	background-color: #FFFFFF;				/* background color for main page content */
}

#headMenuBars {
	height: 92px;																					/* total height of menu bar section. Should be 22px more than height of #headLogo img */
}

#headLogo img {
	width: 180px;																					/* head logo image width */
	height: 70px;																					/* head logo image height */
}

#switchServiceButton.parentBlock, #close.parentBlock, 
#help.parentBlock, #login.parentBlock, 
#logout.parentBlock, #ic.parentBlock {
	background-image: url(/images/cexp.wamnet.com/HEADER_BUTTON_GRADATION_IMAGE);	/* background image for global nav buttons */
	background-color: #999999;		/* background color for global nav buttons (should be hex color at bottom of background image) */
}

.menu1 {
	border-color: #cccccc;				/* border accent color for 1st main menu */
}

.menu2 {
	border-color: #999999;				/* border accent color for 2nd main menu */
}

.menu3 {
	border-color: #666666;			/* border accent color for 3rd main menu */
}

.menu5 {
	border-color: #333333;			/* border accent color for preferences */
}

.menuH {
	border-color: #cccccc; /* border accent color for login */
}

#menu1 .parentBlock,
th.column.bg1,
.progressbar,
.progressbar.bg1 { 
	background-image: url(/images/cexp.wamnet.com/SEND_TITLE_GRADATION_IMAGE);	/* background image for 1st main menu */
	background-color: #cccccc;			/* background color for 1st main menu (should be hex color at bottom of background image) */	
}

#menu2 .parentBlock,
th.column.bg2,
.progressbar.bg2 {
	background-image: url(/images/cexp.wamnet.com/RECEIVE_TITLE_GRADATION_IMAGE);	/* background image for 2nd main menu */
	background-color: #999999;			/* background color for 2nd main menu (should be hex color at bottom of background image) */
}

#menu3 .parentBlock,
th.column.bg3,
.progressbar.bg3 {
	background-image: url(/images/cexp.wamnet.com/CLIPBOARD_TITLE_GRADATION_IMAGE);	/* background image for 3rd main menu */
	background-color: #666666;		/* background color for 3rd main menu (should be hex color at bottom of background image) */
}

#menu5 .parentBlock,
th.column.bg5,
.progressbar.bg5 {
	background-image: url(/images/cexp.wamnet.com/PREFERENCES_TITLE_GRADATION_IMAGE);	/* background image for preferences */
	background-color: #333333;		/* background color for preferences (should be hex color at bottom of background image) */
}

#menuH .parentBlock,
th.column.bgH,
.progressbar.bgH {
	background-image: url(/images/cexp.wamnet.com/LOGIN_TITLE_GRADATION_IMAGE);	/* background image for login */
	background-color: #cccccc;/* background color for login (should be hex color at bottom of background image) */
}

.bg1 {
	background-color: #cccccc;			/* background accent color for 1st main menu */
}

.bg2 {
	background-color: #999999; 		/* background accent color for 2nd main menu */
}

.bg3 {
	background-color: #666666; 		/* background accent color for 3rd main menu */
}

.bg5 {
	background-color: #333333;		/* background accent color for preferences */
}

.bgH {
	background-color: #cccccc; /* background accent color for login */
}

.menuBorders, .menuBordersActive {
	border-left-color: #FFFFFF;				/* left border color for section navigation menu links */
}

.parentBlock,
.nestedBlockRight,
.nestedBlockLeft,
.childBlock {
	background-color: #cc3333;		/* background color for menu dropdown links */
}

.childBlock,
.nestedBlockRight,
.nestedBlockLeft {
	border-color: #000000;					/* border color for menu dropdown links */
}

a.option,
a.option:hover,
a.nestedTitle,
a.nestedTitle:hover,
a.nestedOption,
a.nestedOption:hover {
	color: #FFFFFF;							/* link text color for menu dropdown links */
	border-bottom-color: #000000;				/* bottom border color for menu dropdown links */
}

a.bold,
#leftColumn a,
#rightColumn a,
.pagedLinks a  {
	color: #000000 !important;			/* link text color for main page content, main page navigation & paging navigation*/
}

a:hover.bold,
#leftColumn a:hover,
#rightColumn a:hover,
.pagedLinks a:hover  {
	color: #CC3333 !important;			/* link hover text color for main page content & main page navigation*/
}

a,
.links a {
	color: #000000;						/* link text color for main page content, main page navigation & paging navigation*/
}

a:hover,
a.option:hover,
a.nestedTitle:hover,
a.nestedOption:hover,
.links a:hover {
	color: #CC3333;						/* link hover text color for main page content & main page navigation*/
}

a.option:hover,
a.nestedTitle:hover,
a.nestedOption:hover,
a:hover img {
	background-color: #999999;				/* link hover background color for icons */
}

table.data {
	color: #000000;						/* text color for table content */
	border-left-color: #000000;				/* border color for table cells */
	border-top-color: #000000					/* border color for top of table */
}

table.data th, table.data td {
	border-right-color: #000000;				/* border color for table cells */
	border-bottom-color: #000000;				/* border color for bottom of th cell */
}

table.data td, table.data th.row {
        background-color: #FFFFFF;	/* background color for data table cells */
        border-bottom-color: #000000;			/* border color for table cells */
}

table.data tr.even td, table.data tr.even th.row {
	background-color: #E8E8E8;		/* Alternate color 2 table cells */
}

#mainColumn h2, #mainBody h2,
#leftColumn h3, #rightColumn h3,
.modalPaneIframe h3, .border,
table.text h3,
.fText, .fRequired,.fLabel,
#section1Panel, 
#section2Panel, 
#section3Panel, 
#section4Panel {
	border-bottom-color: #000000;				/* bottom border color */
}

#leftColumn,
#mainColumn,
#rightColumn .content,
fieldset,
.styledPanel .pagedLinks select,
.progressbar {
	border-color: #000000;					/* border color */
}

#footer,
#footerLeft,
#footerRight,
#footerLogos {
	border-top-color: #000000;				/* top border color */
}

a.title,
a.toggle,
th.column.bg1,
th.column.bg2,
th.column.bg3,
th.column.bg4,
th.column.bgH,
th.column.bg1 a,
th.column.bg2 a,
th.column.bg3 a,
th.column.bg4 a,
th.column.bgH a
div.modalMenu .menuPanel h4,
h2#modalPaneTitle,
h1#section1Title, h2#section1Title, h4#section1Title, 
h1#section2Title, h2#section2Title, h4#section2Title,
h1#section3Title, h2#section3Title, h4#section3Title, 
h1#section4Title, h2#section4Title, h4#section4Title {
	color: #000000;						/* title text color (on graduated backgrond image) */
}

#section1Controls a,
#section2Controls a,
#section3Controls a,
#section4Controls a {
	color: #000000 !important;				/* title text color (on graduated backgrond image) */
}

h1.bg1, h2.bg1, h4.bg1,
div.modalMenu .menuPanel .bg1 {
	background-image: url(/images/cexp.wamnet.com/SEND_TITLE_GRADATION_IMAGE_FLIP);								/* rotated background image for 1st main menu */
}

h1.bg2, h2.bg2, h4.bg2,
div.modalMenu .menuPanel .bg2 {
	background-image: url(/images/cexp.wamnet.com/RECEIVE_TITLE_GRADATION_IMAGE_FLIP);							/* rotated background image for 2nd main menu */
} 

h1.bg3, h2.bg3, h4.bg3,
div.modalMenu .menuPanel .bg3 {
	background-image: url(/images/cexp.wamnet.com/CLIPBOARD_TITLE_GRADATION_IMAGE_FLIP);							/* rotated background image for 3rd main menu */
}

h1.bg5, h2.bg5, h4.bg5,
div.modalMenu .menuPanel .bg5 {
	background-image: url(/images/cexp.wamnet.com/PREFERENCES_TITLE_GRADATION_IMAGE_FLIP);						/* rotated background image for preferences */
} 

h1.bgH, h2.bgH, h4.bgH,
div.modalMenu .menuPanel .bgH {
	background-image: url(/images/cexp.wamnet.com/LOGIN_TITLE_GRADATION_IMAGE_FLIP);								/* rotated background image for login */
} 

#section1Controls,
#section2Controls,
#section3Controls,
#section4Controls {
	color: #000000; 				/* inactive body hyperlink color */
}

#modalPaneNav,
.modalPaneIframe #section1Controls,
.modalPaneIframe #section2Controls,
.modalPaneIframe #section3Controls,
.modalPaneIframe #section4Controls {
	color: #000000; 				/* inactive modal hyperlink color */
}

#modalMenu .fButt, #modalPane .fButt,
div.modalMenu ul, div.modalMenu ol,
.modalPaneIframe, .modalPaneIframe h3,
.modalPaneIframe table.data, .modalPaneIframe caption,
.modalPaneIframe .fRequired, .modalPaneIframe .fLabel, .modalPaneIframe .fInput, .modalPaneIframe .fFile, .modalPaneIframe .fText, .modalPaneIframe .fButt,
.modalPaneIframe .tableNest .fLabel, .modalPaneIframe .tableNest .fText, .modalPaneIframe.tableNest .fInput, 
.modalPaneIframe.error, .modalPaneIframe.confirm,
#modalPaneActions { 
	color: #000000;						/* modal pane text color */
}

#deactivatePage, #deactivateFrame { 
	background: #000000;			/* inactive background color when modal active */
}

#section1Panel .l2, 
#section2Panel .l2,
#section3Panel .l2, 
#section4Panel .l2,
#section1Panel .l3, #section1Panel .l4, #section1Panel .styledPanel,
#section2Panel .l3, #section2Panel .l4, #section2Panel .styledPanel,
#section3Panel .l3, #section3Panel .l4, #section3Panel .styledPanel,
#section4Panel .l3, #section4Panel .l4, #section4Panel .styledPanel {
	border-left-color: #000000;				/* rounded section border color */
	border-right-color: #000000;				/* rounded section border color */
}

#section1Panel .l1,
#section2Panel .l1,
#section3Panel .l1,
#section4Panel .l1 {
	background-color: #000000;
}

#section1Panel .bottomCorners .l2, #section1Panel .bottomCorners .l3 , #section1Panel .bottomCorners .l4,
#section2Panel .bottomCorners .l2, #section2Panel .bottomCorners .l3 , #section2Panel .bottomCorners .l4,
#section3Panel .bottomCorners .l2, #section3Panel .bottomCorners .l3 , #section3Panel .bottomCorners .l4,
#section4Panel .bottomCorners .l2, #section4Panel .bottomCorners .l3 , #section4Panel .bottomCorners .l4,
#section1Panel .styledPanel,
#section2Panel .styledPanel,
#section3Panel .styledPanel,
#section4Panel .styledPanel,
#rightColumn,
table.data,
table.fInput {
	background-color: #FFFFFF;			/* rounded section background color */
}


.modalPaneIframe a.bold, div.modalMenu a {
	color: #000000  !important;			/* modal link color */
}

.modalPaneIframe a.bold:hover, div.modalMenu a:hover {
	color: #CC3333  !important;		/* modal hover link color */
}

#modalPaneScroll,
div.modalMenu .menuPanel,
div.modalMenu .menuPanel div.content {
	border-bottom-color: #000000;		/* modal rounded section border color */
}

#modalPane .l2, #modalPane .l3, #modalPane .l4, #modalPane .styledPanel,
div.modalMenu .l2, div.modalMenu .l3, div.modalMenu .l4, div.modalMenu .menuPanel,
.modalPaneIframe #section1Panel .l2, .modalPaneIframe #section1Panel .l3, .modalPaneIframe #section1Panel .l4, .modalPaneIframe #section1Panel .styledPanel,
.modalPaneIframe #section2Panel .l2, .modalPaneIframe #section2Panel .l3, .modalPaneIframe #section2Panel .l4, .modalPaneIframe #section2Panel .styledPanel,
.modalPaneIframe #section3Panel .l2, .modalPaneIframe #section3Panel .l3, .modalPaneIframe #section3Panel .l4, .modalPaneIframe #section3Panel .styledPanel,
.modalPaneIframe #section4Panel .l2, .modalPaneIframe #section4Panel .l3, .modalPaneIframe #section4Panel .l4, .modalPaneIframe #section4Panel .styledPanel { 
	border-left-color: #000000; 		/* modal rounded section border color */
	border-right-color: #000000;		/* modal rounded section border color */
}

/* in the customization preview we fake what is normally iframe content...need a couple of special styles to make it work...*/
#modalPane.modalPaneIframeSimulation .bottomCorners .l2, #modalPane.modalPaneIframeSimulation .bottomCorners .l3 , #modalPane.modalPaneIframeSimulation .bottomCorners .l4,
#modalPane.modalPaneIframeSimulation form,
body.modalPaneIframe,
div.modalMenu .menuPanel, div.modalMenu ul, div.modalMenu ol,
div.modalMenu .bottomCorners .l2, div.modalMenu .bottomCorners .l3 , div.modalMenu .bottomCorners .l4,
#modalPane form, #modalPaneIframeWrapper, #modalPane .styledPanel,
#modalPane .bottomCorners .l2, #modalPane .bottomCorners .l3, #modalPane .bottomCorners .l4 {
	background-color: #FFFFFF;				/* modal background color */
}

div.modalMenu .l1,
#modalPane .l1,
.modalPaneIframe #section1Panel .l1,
.modalPaneIframe #section2Panel .l1,
.modalPaneIframe #section3Panel .l1,
.modalPaneIframe#section4Panel .l1 {
	background-color: #000000;			/* modal rounded section border color */
}

/* in the customization preview we fake what is normally iframe content...need a couple of special styles to make it work...*/
#modalPane.modalPaneIframeSimulation .modalPaneIframe form,
.modalPaneIframe #section1Panel .bottomCorners .l2, .modalPaneIframe #section1Panel .bottomCorners .l3 , .modalPaneIframe #section1Panel .bottomCorners .l4,
.modalPaneIframe #section2Panel .bottomCorners .l2, .modalPaneIframe #section2Panel .bottomCorners .l3 , .modalPaneIframe #section2Panel .bottomCorners .l4,
.modalPaneIframe #section3Panel .bottomCorners .l2, .modalPaneIframe #section3Panel .bottomCorners .l3 , .modalPaneIframe #section3Panel .bottomCorners .l4,
.modalPaneIframe #section4Panel .bottomCorners .l2, .modalPaneIframe #section4Panel .bottomCorners .l3 , .modalPaneIframe #section4Panel .bottomCorners .l4,
.modalPaneIframe #section1Panel .styledPanel,
.modalPaneIframe #section2Panel .styledPanel,
.modalPaneIframe #section3Panel .styledPanel,
.modalPaneIframe #section4Panel .styledPanel,
.modalPaneIframe table.data,
.modalPaneIframe table.fInput {
	background-color: #FFFFFF;		/* modal rounded section background color */
}

.modalPaneIframe .styledPanel .pagedLinks select {
	border-color: #000000;				/* modal rounded section border color */
}

.error {
	color: #000000 !important;;						/* text color for error messages */
}

.jtkError,
.validationError {
	border-left-color: #000000 !important;;			/* border color for elements failing validation */
}

.confirm {
	color: #000000 !important;;				/* text color for confirmation messages */
}