/*_____________________________________________________________________________________________________________________
		IMPORTED EFT STYLESHEET - formerly: @import url(directory-eft.css);
=======================================================================================================================*/
#pagerLinks { float: right; }
#pagerLinks li { display: inline; padding: 2px; }
#pagerLinks li a { color: #0000ee; }
#pagerLinks ul { display: inline; padding: 0px; margin: 0px; list-style: none; }
#pagerLinks li a.active { font-weight: bold; }

OpxGROUP { color: #808080; }
OpxION { color: #000000; }

.buttonBar { background: #e0e0e0; padding: 5px; text-align: right; }

input.cautionButton { color: #993333; }

.checkboxes1 { background-color: #e0e0e0; }
.checkboxes2 { background-color: #e0e0e0; }

.checkoutForm td { padding: 4px; margin: 2px; }

.copyrightText { font-size: 10px; color: #404040; font-family: Arial, Verdana; }

.describePage { font-size: 11px; color: #306030; font-family: Arial, Verdana; border: 1px solid #61768f; border-top: 0px none; padding-bottom: 4px; padding-top: 4px; }

.error { color: #FF0000; font-weight: bold; }
.errorMessage { color: #901000; }

.evenRow { background: #e0e0e0; border-bottom-style: solid; border-bottom-width: 1px; border-color: #a0a0a0; }

.formCell { padding: 3px; border-top: solid 1px #cde0e4; border-bottom: solid 1px #cde0e4; border-right: solid 1px #cde0e4; }
.fullSpanCell { padding: 8px; }

.headerRow { font-weight: bold; font-size: 12px; background: #61768f; color: #fff; text-align:left; }
.headerRow a { font-weight: bold; font-size: 12px; background: #61768f; color: #fff; text-align: center; }

.hiliteRow { background: #ec9; border-bottom-style: solid; border-bottom-width:1px; border-color:#a0a0a0; }
.hiliteRow11 { background: #eee999; border-bottom-style:solid; border-bottom-width:1px; border-color:#a0a0a0; }
.hiliteRow12 { background: #e99; border-bottom-style: solid; border-bottom-width:1px; border-color:#a0a0a0; }

.inactiveRow { background: #808080; border-bottom-style: solid; border-bottom-width:1px; border-color:#a0a0a0; }

.label { font-size: 11px; color: #333; font-family: Arial, Verdana; }
.labelBold { font-size: 11px; color: #333; background-color: #ccc; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
.labelFormCell { padding: 8px; text-align: left; background-color: #cde0e4; border-right: dotted 1px #C0C0C0; border-left: solid 1px #cde0e4; border-top: solid 1px #cde0e4; border-bottom: dotted 1px #C0C0C0; }

.matrix { font-size: 11px; color: #200000; font-family: Arial, Helvetica, sans-serif; }
.matrixBG { font-size: 11px; color: #200000; font-family: Arial, Helvetica, sans-serif; background: #C7C0CF; }
.matrixElement { padding: 2px; border: 0px; }
.matrixLabel { font-size: 11px; color: #200000; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }

.message { font-size: 14px; color: #61768f; font-family: Arial, Helvetica, sans-serif; }

.newMessages a:link,
.newMessages a:visited,
.newMessages a:hover { color: #00f; font-weight: bold; text-decoration: none; }

.oddRow { background: #ededed; border-bottom-style:solid; border-bottom-width:1px; border-color:#a0a0a0; }

.profileCornerTable { background-color: #e0e0e0; }
.ProfileEditHead { border-bottom: 1px #808080 solid; }
.ProfileEditTail { border-top: 1px #808080 solid; }
.ProfileError { color: #D00000; font-size: 11px; border-bottom: 1px dotted #A09080; }
.ProfileHide { color: #008080; font-size: 11px; border-bottom: 1px dotted #A09080; border-right: 1px #808080 solid; white-space: nowrap; }
.ProfileLabel { color: #606060; font-weight: bold; font-size: 11px; border-bottom: 1px dotted #A09080; border-left: 1px #808080 solid; }
.profileMessageBottom { border-bottom: 1px #808080 solid; color: #1c5f50; }
.ProfileModuleBar { padding: 4px; border: 1px #808080 solid; border-bottom: 0px; background-color:#e0e0e0; font-size: 14px; font-weight: bold; color: #808080; }
.ProfileModuleBox { border: 1px #808080 solid; margin-bottom: 8px; }
.ProfileTip { color: #0000A0; font-size: 10px; }
.ProfileUsername { color: #808080; font-size: 20px; font-weight: bold; }
.ProfileValue { color: #000; font-size: 11px; border-bottom: 1px dotted #A09080; }
.ProfileViewLabel { color: #606060; font-weight: bold; font-size: 11px; }
.reportCellHeader { font-weight: bold; color: #ffffff; background: #000000; border-right: 1px #404040 solid; padding-left:10px; padding-right:10px; text-align: center; }
.reportDetailBox { border: 1px dotted #a0a0a0; font-size: small; color: #606060; }
.reportDetailHeader { font-weight: bold; color: #606060; border-bottom: 1px #a0a0a0 dotted; text-align: right; }
.reviewBodyCell { color: #1c5f50; border-bottom: 1px #808080 dashed; }
.reviewMessage { border: 1px #808080 solid; }

.selectPageTab { background-color: #61768f; color: #fff; }
.spreadSheet { background: #fff; border: 1px solid #C7C0CF; padding:0px; text-align:left; }
.standardMessage { font-size: 12px; color: #61768f; font-family: Arial, Verdana; }
.subHeaderRow { font-size: 12px; background: #61768f; color: #FFFFFF; }
.totalRow { background: #A5C3EF; text-align: right; font-size: 12px; font-weight: bold; }
.unit { font-size: 11px; color: #61768f; font-family: Arial, Verdana; }
.unselectPageTab { background-color: #A0A0A0; color: #202020; }
.wsElement { padding: 2px; border: 0; }
.xf-changedRow { background: #aaf1b9; }
.xf-checkbox { margin-top:2px; margin-left: 6px; }
.xf-describeTab { font-size: 11px; color: #306030; font-family: Arial, Verdana; border: 1px solid #808A99; border-top: 0px none; padding-bottom: 4px; padding-top: 4px; }
.xf-divRegionHeader { background-color: #35637b; padding: 3px; margin-bottom: 10px; }
.xf-fieldElement { font-size: 11px; padding: 2px; vertical-align: top; }
.xf-fieldLabel { font-family: Verdana, arial, sans-serif; font-size: 11px; text-align: left; color: #020250; padding: 2px; vertical-align: top; padding-right: 10px; white-space: nowrap; }
.xf-formButton { color: #070092; background-color: #d0d0d0; border-top: #e0e0e0 1px solid; border-left: #b4b4b4 1px solid; border-right: #b4b4b4 1px solid; border-bottom: #909090 1px solid; padding: 2px; white-space: nowrap; }
.xf-formButton a:link,
.xf-formButton a:visited,
.xf-formButton a:active { color: #070092; text-decoration: none; }
.xf-formButton a:hover { text-decoration: underline; }
.xf-legend { font-size: 14px; font-weight: bold; color: #808080; padding-bottom: 6px; }
.xf-matrixEvenCell { font-size: 11px; padding: 4px; background-color: #E4E4E4; }
.xf-matrixHeadCell { font-size: 11px; text-align: center; padding: 2px; vertical-align: bottom; color: #FFFFFF; background-color: #808080; }
.xf-matrixHeadCell a { color: #FFFFFF; }
.xf-matrixOddCell { font-size: 11px; padding: 4px; background-color: #D6D6D6; }
.xf-popBody { border-left: 1px #61768f solid; border-right: 1px #61768f solid; border-bottom: 1px #61768f solid; padding: 6px; }
.xf-popTop { border: 1px #61768f solid; padding: 4px; color: #61768f; background-color: #e0e0e0; font-weight: bold; cursor: pointer; }
.xf-req { color: #990000; font-size: 11px; }
.xf-searchCallout { background-color: #D0D0D0; border: solid; border-width: 2px; border-color: #808080; color: #000000; margin-bottom: 8px; height: 32px; }
.xf-selectTab { background-color: #808A99; color: #FFFFFF; }
.xf-sortList { border-bottom: 1px #c0c0c0 dotted; background: #f0f0f0; }
.xf-stdBorder { border: solid; border-width: 1px; }

/*_____________________________________________________________________________________________________________________
		SHARED DIRECTORY STYLES START HERE
=======================================================================================================================*/
/*------  Lists: ul ol dl --------------------*/
ul, ol { color: #000; font-size: 13px; line-height: 1.35em; margin: .5em 0 1em; }
div#col1_content ul, div#col1_content ol { margin-top: 0px; }
div#col2_content ul { list-style: disc outside; }

li { margin: 0 0 .5em 25px; }

div#col2_content dl { margin-top: -5px; }
div#col2_content dl dt { font-weight: bold; margin-top: 10px;}
div#col2_content dl dd { padding: 0px 0px 0px 10px; }

/*span.footnote { display: block; font-size: 11px; line-height: 13px; color: #666; margin: 3px 0px 8px; padding-top: 3px; }*/

/*_________________________________________________________________________________
		OVERRIDING STYLES
===================================================================================*/
/*hr { width: auto; }*/

/* ------- OVERRIDING SITE FORM STYLES  ------------*/
/*#main form { margin-bottom: 0px; overflow: visible; }
form label { font-size: inherit; font-weight: normal; }*/

/* ------- OVERRIDING SITE TABLE STYLES  ------------*/
/*table { margin: 0px; color: #000; width: inherit; border-collapse: collapse; }
table th, table td { padding: 0px; text-align: left; border: 0px none; font-family: Arial, Helvetica, sans-serif; }
table th { background-color: #ccc; font-weight: bold; vertical-align: bottom; font-size: 13px; line-height: 15px; }
table tfoot th { vertical-align: top; }
table td { background-color: transparent; vertical-align: baseline; font-size: 11px; line-height: 17.5px; }*/

/*_________________________________________________________________________________
		GENERIC / UTILITY / X-FORM STYLES
===================================================================================*/
div#devIndicator { display: none; }
.topBar { background-color: #606060; width: 100%; margin-bottom: 10px; }
.topBar td { font-size: 16px; font-weight: bold; color: #fff; background-color: #606060; padding: 2px; }
.topBar table[width="100%"] { width: 100%; }
.borderframe { border: 2px solid #C0C0C0; } /* being used on iframes in supp dashboard */
.loginform { border: 1px #c0c0c0 solid; }
.loginform td { padding: 8px; }
.registrationform td { padding: 4px; margin: 2px; }
.upgradeList td { padding: 4px; margin: 2px; vertical-align: top; }
.phaseRow td { background-color: #808080; color: #ffffff; border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 4px; font-weight: bold; vertical-align: bottom; }
.detailRow td { background-color: #e4e4e4; color: #404040; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; padding: 4px; vertical-align: middle; }

body#directory div#main div#FormHead table.formulaDetail .detailRow td select,
body#directory div#main div#FormHead table.formulaDetail .detailRow td input { margin: 3px 3px; }
.xformHr { margin: 6px 0px; color: #808080; height: 2px; }
.scroller { max-height: 200px; overflow: scroll; overflow-x: hidden; overflow-y: auto; }
a.button { background-color: #ccc; padding: 4px; text-decoration: none; font-weight: bold; }
.searchOption { border-bottom: 1px solid #ced5e6; padding-bottom: 5px; padding-top: 5px; }

.ffmMaterialSelected,
.ffmMaterialUnselected { font-size: 13px; display: block; padding: 3px 5px 5px; width: 308px; border: 1px solid #999; }
.ffmMaterialSelected { background-color: #ff6; color: #000; }
.ffmMaterialUnselected { background-color: #ccc; color: #666; }
body#directory #col2_content { padding: 5px 10px 10px 10px; }
body#directory p#logoutLink { position: absolute; top: 10px; right: 14px; margin: 0px; width: 70px; height: 22px; text-align: center; }
body#directory p#logoutLink a { display: block; padding: 3px 5px; height: 12px; font-size: 11.5px; line-height: 12px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; background-color: #900; border: 1px solid #000; color: #fff; text-decoration: none; text-shadow: 1px 1px 1px rgba(0,0,0,.3); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.3), inset -2px -2px 5px rgba(0,0,0,.5), inset 1px 1px 5px rgba(255,255,255,.5); -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3); box-shadow: 1px 1px 2px rgba(0,0,0,.3), inset -2px -2px 5px rgba(0,0,0,.5), inset 1px 1px 5px rgba(255,255,255,.5); }
body#directory p#logoutLink a:link, body#directory p#logoutLink a:visited, body#directory p#logoutLink a:hover { color: #fff; }
body#directory p#logoutLink a:hover { text-decoration: underline; border-color: #333; -moz-box-shadow: inset 0px 0px 8px rgba(255,255,255,.4), 0px 0px 4px rgba(0,0,0,.3); -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.4); box-shadow: inset 0px 0px 8px rgba(255,255,255,.4), 0px 0px 4px rgba(0,0,0,.3); }
body#directory p#logoutLink a:active { -moz-box-shadow: inset 2px 2px 5px rgba(0,0,0,.6); -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.6); box-shadow: inset 2px 2px 5px rgba(0,0,0,.6); color: #ddd; color: rgba(255,255,255,.8); border-color: #000; }

/* ----- Errors and Messages ------------------------------------ */
.xf-errorMessage, /* - You do not have permissions to view form - found on editor console when trying to view a dashboard as a supplier (bug?) */
body#directory p.dirError { text-align: center; border-top: 2px solid #900; border-bottom: 2px solid #900; font-size: 14px; font-weight: bold; line-height: 22px; margin: 0px 0px 5px 0px; color: #900; }

.formulaMessage { width: 100%; background: #ffffa0; color: #900; }

/* "status" messages - no warnings, mostly good things! */
body#directory p.dirMessage, /* - logged in successfully - */
.xf-infoMessage, /* record saved successfully - after save and closing a formula in supplier dashboard-- */
.editorChangesMessage { font-size: 13px; color: #000; background-color: #ff8; border: 1px solid #999; line-height: 25px; margin: 0px 0px 5px 0px; text-align: center; }

.xf-textFieldChanged { background-color: #fe6; }
.xf-textFieldUnchanged { background-color: #c0c0c0; }


.xf-tip { color: #666; font-size: 11px; text-align: left; } /* found this one on supplier dashboard - it adds 'http://' to the front of company web sites */

.xf-unselectTab { background-color: #D0D0D0; color: #202020; }
.xf-validErr { color: #500; font-size: 11px; }
.xf-headerError { font-size: 12px; font-weight: bold; color: #FF4040; text-align: center; }
.xf-headerInfo { font-size: 12px; font-weight: bold; color: #A0A0A0; text-align: left; }
.instruction { color: #999; font-size: 12px; }
.xf-errorRow td { background-color: #ff8; } /* found this after selecting us on gci supplier reg. on the zip code row */

/*_________________________________________________________________________________
		FORM ELEMENT STYLES
===================================================================================*/
body#directory input.submit { padding: 3px 7px; }
body#directory #col2_content input.text:focus { border-color: #666; }

body#directory #col2_content label { display: block; margin: 3px 0px 1px 0px; font-weight: bold; }

div#main input.password,
body#directory div#main input.text { background-image: url("../images/shared/inputBg.gif"); background-position: 0 50%; background-repeat: repeat-x; }

div#main input.password,
body#directory #col1_content input.text,
body#directory #col2_content input.text { width: 200px; margin: 0px 10px 10px 0px; border: 1px solid #000; padding: 4px 3px; font-family: Lucida Grande, Arial, Helvetica, sans-serif; font-size: 11px; display: block; }

body#directory #col1_content input.checkbox,
body#directory #col2_content input.checkbox { margin-top: 2px; display: block; }

body#directory #col1_content label.checkboxLabel,
body#directory #col2_content label.checkboxLabel { font-weight: normal; padding: 0px 0px 0px 20px; margin: -15px 0px 10px 0px; }

body#directory input.radio { margin: 4px 2px 0px 0px; }

body#directory #col1_content input.submit,
body#directory #col2_content input.submit { display: inline-block; clear: left; }

body#directory #col1_content select,
body#directory #col2_content select { margin: 0px 10px 10px 0px; }

body#directory textarea#userComment { width: 375px; height: 100px; margin: 0px 10px 10px 0px; padding: 4px 3px; border: 1px solid #000; display: block; font-family: Lucida Grande, Arial, Helvetica, sans-serif; }
body#directory textarea#userComment:focus { border-color: #666; }

/* generic buttons for dashboard pages */
body#directory input.button { padding: 2px 4px; background-color: #ccc; border: 1px solid #000; cursor: pointer; font-size: 11px; font-family: Arial, Helvetica, sans-serif; display: block; display: inline-block; overflow: visible; }
body#directory input.button:hover { background-color: #ddd; }

body#directory div#main div#dashboardForms input.text,
body#directory div#main div#dashboardForms select { width: auto; margin: 0px 5px 0px 0px; }
body#directory div#main div#dashboardForms select#x_company_2enewLicense { width: 200px; }

body#directory div#main form input.xf-textFieldUnchanged,
body#directory div#main form input.xf-textFieldChanged { margin: 0px 5px 0px 0px; border: 1px solid #000; padding: 4px 3px; font-family: Lucida Grande, Arial, Helvetica, sans-serif; overflow: hidden; }

p.requiredNotice { margin: 0px 0px 10px; }
span.requiredField { color: #900; margin: 0px 1px 0px 0px; }

body#directory textarea { border: 1px solid #000; font-family: Lucida Grande, Arial, Helvetica, sans-serif; font-size: 12px; line-height: 17px; padding: 0px 0px 0px 5px; }

fieldset { border: 1px solid #000; padding: 5px 10px; margin: 0px 15px 15px 0px; overflow: hidden; }
fieldset legend { padding: 0px 5px; color: #000; font-size: 15px; }
fieldset.error { border: 1px solid #900; }
fieldset.error legend { color: #900; }
label.error { color: #900; }
input.error { border: 2px solid #900; }

/*_____________________________________________________________________________________________________________________
		LOGIN PAGE STYLES
=======================================================================================================================*/
/* ----- screen shots in col1 div#ffmSamples -------------------- */
div#ffmSamples { padding: 7px 10px; }
div#ffmSamples h2 { margin-bottom: 5px; }
div#ffmSamples a.thickbox img { width: 100px; border: 1px solid #333; margin: 5px 10px 5px 0px; }
div#ffmSamples p { margin: 0px 0px 15px 0px; }

/* ----- Update Special Page in col1 div#ffmPrintAd ------------- */
div#ffmPrintAd { padding: 7px 10px; }
div#ffmPrintAd img { float: right; margin: 0px 0px 5px 10px; border: 1px solid #333; }

/* ----- screen shots in col1 div#gciSamples -------------------- */
div#gciSamples { padding: 7px 10px; }
div#gciSamples h2 { margin-bottom: 5px; }
div#gciSamples a.thickbox img { width: 100px; border: 1px solid #333; margin: 5px 10px 5px 0px; }
div#gciSamples p { margin: 0px 0px 15px 0px; }

/* ----- FFM Pricing Options in col3 div#ffmPricing ------------- */
div#ffmPricing { padding: 7px; margin: 0px 0px 0px -2px; position: relative; top: 130px; border: 2px solid #000; background-color: #fff; width: 180px; }
div#ffmPricing h2 { background: url("../images/shared/boxArrow.gif") no-repeat 1px 0; padding-left: 20px; margin-left: -20px; height: 20px; line-height: 20px; }
div#col3_content div#ffmPricing.top { top: 34px; margin: 0px; }
div#ffmPricing.top h2 { background: none; margin-left: 0px; padding-left: 0px }
div#ffmPricing ul li { margin: 0px 0px 7px 10px; line-height: 14px; }
div#ffmPricing ul li.header { margin: 10px 0px 7px 0px; }
div#ffmPricing p.note { font-size: 10px; margin: 0px 0px 5px; }

/* ----- Login Box div#signIn ----------------------------------- */
body#directory div#signIn { float: right; width: 220px; margin: 0px 0px 10px 10px; padding: 5px; border: 2px solid #000; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }
body#directory div#signIn form#loginForm { margin-bottom: 0px; padding: 5px; }
body#directory div#signIn input.text { margin: -3px 0px 10px 0px; }

/* ----- forgot your password? link ----------------------------- */
body#directory div#signIn p { margin: 10px 0px 0px; }
body#directory div#signIn p#forgotLink { margin: 0px 0px 10px; }
body#directory div#signIn form#loginForm label { margin: 3px 0px 5px 0px; font-weight: normal; }
body#directory div#signIn form#loginForm label.radioLabel { padding-left: 21px; cursor: pointer; }
body#directory div#signIn form#loginForm input.radio { float: left; clear: left; margin: 2px 8px 3px 0px; cursor: pointer; }
body#directory div#col1_content div#loginForm label.checkboxLabel { font-weight: normal; padding: 0px 0px 0px 20px; display: block; }
body#directory div#signIn form#loginForm label.checkboxLabel { font-weight: normal; padding: 0px 0px 0px 20px; margin: -15px 0px 5px 0px; }

body#directory div#ffmUpdateForm { float: right; overflow: hidden; }
body#directory div#ffmUpdateForm div#signIn,
body#directory div#ffmUpdateForm div#signUp { float: none; clear: none; }
body#directory img#ffmCover,
body#directory div#ffmUpdateForm + img { border: 1px solid #666; float: right; margin: 0 10px 10px; }

/*_________________________________________________________________________________
		NEW LOGIN FOR FFM
===================================================================================*/
div#newLogin.wrapper { margin: 0px auto; overflow: hidden; width: 960px; }

div#newLogin div ul { text-align: left; list-style-type: disc; }

div#newLogin h1 { font-weight: bold; font-size: 22px; line-height: 24px; text-align: center; }
div#newLogin h5 { margin-bottom: 17px; font-size: 13px; line-height: 16px; text-align: center; }

div#newLogin div#newUsers { width: 260px; margin: 0px 0px 20px 0px; padding: 0px 40px 10px 10px; border-right: 1px solid #636567; float: left; text-align: center; }
div#newLogin div#newSuppliers { width: 260px; margin: 0px 0px 20px -1px; padding: 0px 10px 10px 40px; border-left: 1px solid #636567; float: left; text-align: center; }

div#newLogin div#newUsers h2,
div#newLogin div#newSuppliers h2 { padding: 2px 0px; color: #636567; font-weight: bold; font-size: 17px; line-height: 19px; text-shadow: 1px 1px 3px rgba(0,0,0,.15); }

input.signUpButton { width: 100px; margin: 0px auto; padding: 2px 3px; border: 1px solid #000; display: inline-block; color: #fc3; font-weight: bold; font-size: 13px; text-shadow: 1px 1px 2px #333; cursor: pointer; background-color: #636567; }
input.signUpButton:hover { text-decoration: underline; }

div#newLogin div#signIn { width: 210px; margin: 5px 5px 20px; padding: 5px 10px 10px; border: 3px solid #fc3; float: right; -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.4); -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.4); box-shadow: 0px 0px 5px rgba(0,0,0,.4); }
div#newLogin div#signIn h2 { color: #636567; font-weight: bold; font-size: 17px; line-height: 19px; }
div#newLogin div#signIn label { display: block; margin: 3px 0px 5px; }

div#newLogin div#faqs { margin: 20px 0px; padding: 15px 15px 10px; border-color: #636567; border-style: solid; border-width: 2px 0px; overflow: hidden; clear: both; background-color: #d8dadf; }
div#newLogin div#faqs div { width: 453px; overflow: hidden; float: left; }
div#newLogin div#faqs div#faqsCol1 { margin-right: 24px; }
div#newLogin div#faqs div h2 { color: #333; font-weight: bold; }

div#moreInfoCol1 { width: 468px; margin-right: 24px; padding: 0px; float: left; }
div#moreInfoCol2 { width: 466px; padding: 0px 1px; float: left; overflow: hidden; }

div#newLogin div#notes { clear: left; }

div#newLogin div#help ul { list-style-type: none; }
div#newLogin div#help ul li { margin-left: 0px; }

div#newLogin div#help { border-top: 1px solid #636567; padding-top: 10px; }

div#pricing { margin: 0px; background-color: #fff; }
div#pricing table { width: 100%; overflow: hidden; }
div#pricing p.note { margin-bottom: 0px; color: #333; font-size: 11px; line-height: 13px; text-align: right; }
div#pricing table th { border: 1px solid #333; padding: 5px 5px; text-align: center; background-color: #d8dadf; }
div#pricing table td { border: 1px solid #333; padding: 3px 5px; text-align: center; }
div#pricing table tr > td:first-child, div#newLogin tr > th:first-child { text-align: left; }
div#pricing table span.checked { width: 14px; height: 13px; margin: 0px auto; display: block; overflow: hidden; font-weight: normal; font-size: 11px; line-height: 11px; text-indent: -9999px; background-image: url("../images/icons/checkmark.gif"); background-position: 0 0; background-repeat: no-repeat; }

div#newLogin div#book { margin: 0px 0px 10px 0px; padding: 20px 0px 2px 106px; overflow: hidden; }
div#newLogin div#book img { margin: -20px 10px 0px -106px; border: 1px solid #333; float: left; -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.3); -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3); box-shadow: 1px 1px 2px rgba(0,0,0,.3); }

div#learnMore div.callout { width: 430px; margin: 20px 0px 20px 20px; padding: 10px; float: right; text-align: center; background-color: #fff; }/* Learn More */

/*_____________________________________________________________________________________________________________________
		REGISTRATION STYLES
=======================================================================================================================*/
/*_________________________________________________________________________________
		BUYER REGISTRATION STYLES
===================================================================================*/
body.gci form#buyerReg1 select { max-width: 250px; }
body.ffm form#buyerReg1 p#accessHelpText { margin: -6px 0px 15px; border-bottom: 1px solid #999; padding-bottom: 15px; font-size: 11px; color: #666; }
body.ffm form#buyerReg1 p#accessHelpText.noBorder { border: none 0px; padding-bottom: 0px; }

/*_________________________________________________________________________________
		SUPPLIER REGISTRATION STYLES
===================================================================================*/
/*highlighted box reminder for already being in the directory*/
div#companyNameMessage { background-color: #ff8; border: 1px solid #000; padding: 10px; width: 178px; float: right; margin: 0px 0px 10px 10px; }
div#companyNameMessage img { float: left; margin: 0px 5px 5px 0px; }
div#companyNameMessage p { margin: 0px; }

body#directory div#captcha { border-style: solid; border-color: #999; border-width: 1px 0px 1px 0px; padding: 10px 0px; margin-bottom: 10px; overflow: hidden; display: block; }
body#directory div#captcha p { margin: 0px 0px 5px 0px; }
body#directory div#captcha img { float: left; margin: 0px 10px 0px 0px; }
body#directory div#captcha input.text { position: relative; top: 15px; display: inline; }

/* ----- directory selection Page ------------------------------- */
div#directoryOptIn { margin-bottom: 10px; }
div#directoryOptIn input.xf-checkbox { display: block; width: 15px; height: 15px; margin: 0px; }
div#directoryOptIn label { display: block; margin: -15px 0px 2px 0px; font-size: 13px; font-weight: bold; text-indent: 20px; }
div#directoryOptIn label.xf-selectedText { /*this will cause the label to cover up the checkbox or to disable the label as a way of selecting the checkbox*/ }
div#directoryOptIn p { margin: 0px 0px 12px; padding-left: 20px; }
div#directoryOptIn > p:first-child { padding-left: 0px; }

/* ----- Commerce Pages ----------------------------------------- */
body#directory div#form input.text { margin: 0px; }
body#directory div#form table.checkoutForm td { margin: 0px; padding: 5px; vertical-align: middle; }
body#directory div#form div { width: 348px; }
body#directory div#form div.errorList { color: #900; font-weight: bold; margin-top: -5px; padding-bottom: 5px; }
body#directory div#form i { font-size: 11px; float: left; }

div#orderWrapper,
div#orderWraper { width: 580px; overflow: hidden; }

div#orderInfo { float: right; width: 300px; }

table#orderItems { width: 300px; }
table#orderItems th { padding: 5px; vertical-align: middle; }
table#orderItems thead th { background-color: #ddd; border-bottom: 1px solid #000; }
table#orderItems thead th.itemName { width: 50%; }
table#orderItems thead th.itemQuantity { text-align: center; width: 55px; }
table#orderItems thead th.itemPrice { text-align: right; }
table#orderItems tbody td { /*border-bottom: 1px solid #666;*/ padding: 2px 5px; vertical-align: middle; }
table#orderItems tbody td.itemName { width: 50%; }
table#orderItems tbody td.itemQuantity { text-align: center; width: 55px; }
table#orderItems tbody td.cartItemsPrice,
table#orderItems tbody td.itemPrice { text-align: right; }
table#orderItems tfoot th { border-top: 1px solid #000; text-align: right; }
table#orderItems tfoot th.itemPrice { background-color: #ffa; }

div#orderInfo p { text-align: right; font-size: 11px; } /*this is for the 'all sales final' line on all ecommerce pages*/

form#orderForm label { display: block; }
body#directory form#orderForm input#ccCode { width: 30px; }

body#directory form#orderForm input#ccExpMonth,
body#directory form#orderForm input#ccExpYear { width: 20px; display: inline; margin-right: 5px; }

form#orderForm div#paymentInfo { width: 225px; }
div#billingInfo h2 { margin-bottom: 2px; } /* confirm order page */
form#orderForm div#billingAddy { width: 225px; margin: 15px 0px 10px 0px; padding: 10px 0px 5px 0px; border-top: 1px solid #999; border-bottom: 1px solid #999; }
div#orderControls { clear: both; width: 580px; padding: 10px 0px 5px 0px; margin-top: 5px; border-top: 1px solid #999; overflow: hidden; }
div#orderControls a { float: left; }
body#directory div#main div#orderControls input.submit { clear: none; float: right; }

div#ffmPrintOffer { float: right; clear: right; width: 280px; padding: 10px; background-color: #ccc; margin: 20px 0px 10px 10px; }
div#ffmPrintOffer img { float: left; margin: 0px 10px 10px 0px; border: 1px solid #000; }
div#ffmPrintOffer p#ffmOrderLink { clear: left; font-size: 10px; margin-bottom: 5px; text-align: center; }
div#ffmPrintOffer p#ffmOrderLink a { font-size: 13px; font-weight: bold; }

div#alluredAddress { display: none; border-top: 1px solid #000; padding-top: .5em; margin: .5em 0; }
div#alluredAddress p { text-align: center; }

fieldset#shippingAddy, fieldset#paymentInfo, fieldset#billingAddy { width: 225px; display: block; }

form#buyerReg3 { position: relative; }
/*form#buyerReg3 table td { height: 18px; }*/

div#ffmShippingPrices { position: absolute; width: 200px; padding: 5px 10px; top: 25px; left: 430px; background-color: #fff; width: 175px; border: 2px solid #000; }
div#ffmShippingPrices h2 { background: url("../images/shared/boxArrow.gif") no-repeat 1px 0; padding-left: 23px; margin-left: -23px; height: 20px; line-height: 20px; position: relative; }
div#ffmShippingPrices table { width: 100%; }
div#ffmShippingPrices table th { padding: 0px 0px 2px; border-bottom: 1px solid #000; font-weight: bold; text-align: left; }
div#ffmShippingPrices table tr td { border-top: 1px solid #ddd; padding: 3px 0px; }

/* ----- Service Upgrades Page ---------------------------------- */
div#companyUpgrades,
div#productUpgrades { width: 375px; padding: 7px 10px 10px; border: 2px solid #999; overflow: hidden; margin-bottom: 10px; }

div#companyUpgrades h2,
div#productUpgrades h2 { margin-bottom: 7px; }

div#individualCompanyUpgrades,
div#completeCompanyPackage,
div#individualProductUpgrades,
div#completeProductPackage { padding: 5px 5px 0px; background-color: #ddd; overflow: hidden; width: 363px; border: 1px solid #999; }

div#completeCompanyPackage, div#completeProductPackage { padding: 5px; }
div.upgradeOption { display: block; overflow: hidden; margin-bottom: 10px; }

div#companyUpgrades input.xf-checkbox,
div#productUpgrades input.xf-checkbox { float: left; clear: left; margin: 0px 3px 0px 0px; width: 15px; height: 15px; }

div#companyUpgrades div label,
div#productUpgrades div label { font-size: 12px; line-height: 14px; float: left; font-size: 12px; line-height: 14px; width: 280px; margin: 0px; padding: 1px 0px 0px; }

div#companyUpgrades p.upgradePrice,
div#productUpgrades p.upgradePrice { font-size: 12px; line-height: 14px; float: left; width: 57px; text-align: right; margin: 0px; }

div#companyUpgrades p.orDivider,
div#productUpgrades p.orDivider { clear: left; text-align: center; margin: 5px 0px; font-size: 12px; line-height: 14px; }

div#upgradeTotals { width: 399px; text-align: right; overflow: hidden; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #999; }
div#upgradeTotals label { display: inline; margin-right: 3px; font-size: 12px; vertical-align: top; position: relative; top: 3px; }
body#directory div#upgradeTotals input { float: right; margin-right: 12px; }
body#directory div#main div#upgradeTotals input#total { float: none; cursor: default; display: inline; font-size: 12px; line-height: 12px; text-align: right; width: 60px; margin: 0px 12px 10px 0px; padding: 4px 13px 2px 4px; font-family: Arial, Helvetica, sans-serif; }

/* ----- License Info Page -------------------------------------- */
div#pastLicenses { border: 2px solid #ccc; margin-bottom: 10px; }
div#pastLicenses table { margin: 0; padding: 0; width: 100%; }
div#pastLicenses table thead th { background-color: #d8dadf; padding: 3px 10px; text-align: left; }
div#pastLicenses table tbody td { border-top: 1px solid #ccc; padding: 3px 10px; }

h2#licenseRenew { float: right; }
h2#licenseRenew a { background-color: #666; border: 1px solid #000; color: #fc3; display: inline-block; height: 18px; line-height: 18px; padding: 3px; text-align: center; text-decoration: none; width: 120px; }
h2#licenseRenew a:hover { color: #fc3; text-decoration: underline; }
#helpText { color: #666; font-size: 11px; font-weight: normal; margin: -10px 0px 15px; }
p span.code { font-family: Courier; font-size: 14px; }

/* ----- License Renewal Page ----------------------------------- */
table#licensingOptions td { padding: 4px; }
table#licensingOptions { width: 300px; }
input#next { margin-left: 203px; }
div#renewWrapper { width: 580px; }
div#lastLicenseInfo { border: 2px solid #ccc; width: 215px; float: right; }
div#lastLicenseInfo h2 { background-color: #d8dadf; padding: 3px 10px; }
div#lastLicenseInfo p { padding: 3px 10px; }
table#licensingOptions td.optionPrice { text-align: right; }
table#licensingOptions td.lastLicense { background-color: #ff8; }
p#printNote { width: 300px; }
td.disabled { color: #666; }
table#licensingOptions td#downgradeMessage { padding: 3px 10px; }
table#licensingOptions td#downgradeMessage p { border-bottom: 1px solid #000; border-top: 1px solid #000; margin-bottom: 6px; padding-bottom: 5px; padding-top: 3px; width: 250px; }

/* ----- Service Renewals Page ---------------------------------- */
form#renewalForm { width: 350px; }

table.renewalOptions { width: 100%; }
table.renewalOptions input.readOnlyText { text-align: right; border: 0px none; width: 60px; }
table.renewalOptions th { vertical-align: middle; font-weight: bold; }
table.renewalOptions thead th { background-color: #ddd; /*border-bottom: 1px solid #000;*/ text-align: left; font-size: 12px; padding: 4px 15px 4px 5px; }
table.renewalOptions thead th.itemPrice { text-align: right; padding-right: 10px; }
table.renewalOptions tbody td { border-top: 1px solid #999; padding: 3px 5px; vertical-align: middle; font-size: 12px; }
table.renewalOptions tbody td.itemPrice { text-align: right; padding-right: 10px; }
table.renewalOptions tfoot th { border-top: 1px solid #000; text-align: right; padding: 4px 10px 4px 5px; }
table.renewalOptions tfoot th.itemPrice { background-color: #ffa; width: 75px; }
table.renewalOptions tfoot th.itemPrice input.readOnlyText { font-weight: bold; background-color: #ffa; }

div#renewalControls { clear: both; padding: 10px 0px 5px 0px; margin-top: 5px; border-top: 1px solid #999; overflow: hidden; }
div#renewalControls a { float: left; }
body#directory div#main div#renewalControls input.submit { clear: none; float: right; }

/*_____________________________________________________________________________________________________________________
		DASHBOARD STYLES
=======================================================================================================================*/
/* ----- Tool Tips Styles: boxover.js --------------------------- */
.thdrcell { background: #F3F0E7; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; padding: 5px; border-bottom: 1px solid #C8BA92; z-index: 99; }
.tdatacell { font-family: Arial, Helvetica, sans-serif; font-size: 12px; padding: 5px; background: #fff; z-index: 99; }
.dvhdr1 { background: #F3F0E7; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; border: 1px solid #C8BA92; padding: 5px; width: 150px; z-index: 99; }
.dvbdy1 { background: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 12px; border-left: 1px solid #C8BA92; border-right: 1px solid #C8BA92; border-bottom: 1px solid #C8BA92; padding: 5px; width: 150px; z-index: 99; }
.dogvdvhdr { width: 300px; background: #C4D5E3; border: 1px solid #C4D5E3; font-weight: bold; padding: 10px; z-index: 99; }
.dogvdvbdy { width: 300px; background: #fff; border-left: 1px solid #C4D5E3; border-right: 1px solid #C4D5E3; border-bottom: 1px solid #C4D5E3; padding: 10px; z-index: 99; }
.pgdiv { width: 320px; height: 250px; background: #E9EFF4; border: 1px solid #C4D5E3; padding: 10px; margin-bottom: 20px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; z-index: 99; }


/*_________________________________________________________________________________
		SUPPLIER DASHBOARD STYLES
===================================================================================*/
div#dashboardTabs { margin: 0px -10px 10px -10px; padding: 0px 10px; width:100%; background: url("../images/shared/dirTabBg.gif") repeat-x 0 100%; }
body.si div#dashboardTabs { margin: 0px -6px 10px -6px; padding: 0px 6px; }

div#dashboardTabs table { width: auto; }
div#dashboardTabs table td { vertical-align: bottom; padding-right: 0px !important; padding-left: 8px; }
div#dashboardTabs table td.xf-stackedTabTd { padding-left: 0px; }

/* This is the currently selected tab when a supplier is using tabs */
.xf-activeCallout { border-style: solid; border-color: #404040 #404040 #fff; border-width: 1px; background-color: #fff; color: #000; padding: 3px 5px; font-size: 12px; font-weight: bold; text-align: left; height: 32px; }
div.xf-activeCallout div a img { width: 14px; height: 14px; }/* close btn on tab */

.xf-inactiveCallout { background-color: #D0D0D0; border: 1px #404040 solid; color: #000000; padding:  3px 5px; font-size: 12px; font-weight: bold; text-align: left; height: 32px; }

/* This is the style for the inactive tabs that are stacked out of view */
.xf-stackedTab { background-color: #d0d0d0; border: 1px #404040 solid; border-left: 0px none; padding:  0px; height: 35px; width: 3px; }

.xf-upgradeList { list-style-type: disc ; }
div#repsTarget select { max-width: 268px; }

/* the h3 on ffm in verdana bold is just too wide, switching it to arial */
body.ffm div#dashboardForms h3 { font-family: Arial, Helvetica, sans-serif; }

/* file picker input breaks and hidesl upload button in chrome and IE  */
div#dashboardForms td.xf-fieldElement iframe[src*="upload"] { height: 45px; }
div#dashboardForms div#InfoTarget iframe { height: 45px; }

div#IngredientTarget { width: 307px; } /* cbr trade name width fixes */

/* need a better selector to get to the functions iframe on the supplier dashboard */
div#FormHead div form table table table div table div table td.xf-fieldElement iframe { width: 500px !important; border: 0px !important; margin: -2px -7px -2px -2px; }

body#directory div#main div#FormHead input.text { width: auto; }
div#dashboardForms ol { list-style-type: decimal; }
body#directory div#main div#dashboardForms input#x_company_2eprimaryContact_2ewebsiteUrl { display: inline; margin-left: 5px; }
div#FormHead div#contactForm span.xf-tip { vertical-align: middle; } /* this is the 'http://' that precedes the website field */
div#FormHead div#contactForm input#x_company_2eprimaryContact_2ewebsiteUrl { display: inline; margin: 0px 0px 10px 5px; } /* this if for the web site field that follows the 'http://' above */
div#FormHead textarea#x_company_2eprimaryContact_2eregion { height: 53px }
.xf-primaryUser { background: #ccf; font-size: 11px; padding: 4px; }/* This is the style of the primary user row */
.xf-inactiveRow { background: #656565; font-size: 11px; padding: 4px; }
input#x_searchCriteria { width: 95px !important; }
body#directory div.topBar input[value="Delete"] { background-color: #900; color: #fff; font-weight: bold; }
body#directory div.topBar input[value="Delete"]:hover { background-color: #c00; }

/* ----- adding Trade Name -------------------------------------- */
body#directory div#main input#x_cbr_5fproduct_2erecommendedUseLevelMin,
body#directory div#main input#x_cbr_5fproduct_2erecommendedUseLevelMax,
body#directory div#main input#x_cbr_5fproduct_2euseLevelMin,
body#directory div#main input#x_cbr_5fproduct_2euseLevelMax,
body#directory div#main input#x_cbr_5fproduct_2ephMin,
body#directory div#main input#x_cbr_5fproduct_2ephMax { margin: 0px 5px 0px 0px; }

/* ----- adding Skin Inc Brand ---------------------------------- */
div#SkinDb td.xf-matrixEvenCell,
div#SkinDb td.xf-matrixOddCell { vertical-align: middle; }

/* ----- .xf-tabs: used on Claims when adding Trade Name -------- */
.xf-tabs div#claimtabs1, .xf-tabs div#claimtabs2, .xf-tabs div#claimtabs3,
.xf-tabs div#claimtabs4, .xf-tabs div#claimtabs5, .xf-tabs div#claimtabs6 { clear: left; padding: 3px 10px 8px 10px; background-color: #fff; border: 1px solid #999; border-top: none 0px; height: 215px; width: 480px; overflow: hidden; }
.xf-tabs div#claimtabs3, .xf-tabs div#claimtabs5 { overflow-y: scroll; }
.xf-tabs ul { margin: 0px; padding-left: 5px; height: 30px; border-bottom: 1px solid #999; }
.xf-tabs ul li { margin: 0px 5px -1px 0px; list-style: none; float: left; }
.xf-tabs ul li a { display: block; padding: 5px; text-decoration: none; font-size: 12px; margin: 1px 1px -1px 0px; color: #333; background: #dadada; border: 1px solid #999; line-height: 18px; }
.xf-tabs ul li a:hover { background-color: #e6e6e6; color: #666; }
.xf-tabs ul li a.selected { background-color: #fff; border-bottom: 1px solid #fff; color: #000; font-weight: normal; margin-bottom: 0px; cursor: default; }
.xf-tabs ul li a.selected:hover { background-color: #fff; color: #000; }

/* ----- .xf-tabs: used on Claims when adding Trade Name -------- */
div#claimtabs { width: 504px; overflow: hidden; border: 1px solid #666; }
div#claimtabs.xf-tabs ul { width: 100px; height: auto; margin: 0px 0px -1px 0px; padding: 0; border-style: solid; border-color: #999; border-width: 0px 1px 0px 0px; float: left; position: relative; }
div#claimtabs.xf-tabs ul li { margin: 0px; list-style: none; float: none; border-bottom: 1px solid #999; }
div#claimtabs.xf-tabs ul li a { display: block; padding: 5px; text-decoration: none; font-size: 12px; margin: 0px; color: #333; background: #dadada; border: 0px none; line-height: 18px; }
div#claimtabs.xf-tabs ul li a:hover { background-color: #e6e6e6; color: #666; }
div#claimtabs.xf-tabs ul li a.selected { background-color: #fff; border: 0px none; color: #000; font-weight: normal; margin: 0px -1px 0 0;  }
div#claimtabs.xf-tabs ul li a.selected:hover { background-color: #fff; color: #000; }
div#claimtabs.xf-tabs div { display: none; float: left; margin-left: -1px; clear: none; padding: 3px 10px 8px 10px; background-color: #fff; border: none 0px; border-left: 1px solid #999; height: auto; width: 380px; overflow: auto; }
div#claimtabs.xf-tabs div td.xf-fieldLabel { white-space: normal; }

/*_________________________________________________________________________________
		ADMIN MENUS AND STYLES
===================================================================================*/
div.podMenu { margin-bottom: 10px; } /* editor console menu */
div.adminMenuBottomRightDiv { height: 20px; }
div.adminMenuBottomRightDiv * { display: none; }

/* ----- Export XML List: export/list.html ---------------------- */
div.xmlExportGroup { border: 1px solid #666; padding: 10px; margin: 0px 0px 10px 0px; background-color: #f2f3f5; }
body#directory div#main div.xmlExportGroup select { margin: 0px 10px 0px 0px; }
div.xmlExportGroup table.xmlExport { margin: 10px 0px 0px 0px; }
div.xmlExportGroup table.xmlExport thead th { padding: 2px 7px; background-color: #666; color: #fff; font-size: 13px; font-weight: bold; }
div.xmlExportGroup table.xmlExport thead th.fileSize { text-align: center; }
div.xmlExportGroup table.xmlExport thead th.action { text-align: center; }
div.xmlExportGroup table.xmlExport tbody tr { border-top: 1px solid #ddd; }
div.xmlExportGroup table.xmlExport tbody td { padding: 3px 7px; background-color: #fff; }
div.xmlExportGroup table.xmlExport tbody td.fileSize { text-align: center; }
div.xmlExportGroup table.xmlExport tbody td.action { text-align: center; }

/* ----- JS Menu Styles ----------------------------------------- */
.JSmenu { visibility: hidden; font-family:Arial, Helvetica, sans-serif; white-space: nowrap; border-right:1px solid #000; border-bottom:1px solid #000; z-index: 1000; }
.JSmenuItem { font-size:13px; font-weight: bold; color: #fff; width:90px; text-align:center; background-color:#a0a0a0; padding: 3px 10px; text-decoration: none; white-space: nowrap; margin-left:3px; cursor:default; }
.JSmenuItem a { color: #fff; font-size: 11px; text-decoration: none; padding-left: 30px; padding-right: 30px; white-space: nowrap; }
.JSmenuItemHover { font-size: 11px; font-weight: bold; color: #5C6D6D; text-align:center; width:90px; margin-left:3px; background-color:#fff; padding: 3px 10px; text-decoration: none; white-space: nowrap; cursor:default; }
.JSmenuItemHover a { color: #fff; padding-left: 30px; padding-right: 30px; font-size: 11px; font-weight: bold; text-decoration: none; white-space: nowrap; }
.JSmenuItemHover a:hover { color: #fff; font-size: 11px; font-weight: bold; padding-left: 30px; padding-right: 30px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItem { color: #fff; background-color:#606060; font-size: 11px; padding: 3px; padding-left:10px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItem a:hover { color: #fff; font-size: 11px; padding: 3px; padding-left:10px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItem a:link { color: #fff; font-size: 11px; text-decoration: none; padding: 3px; padding-left:10px; white-space: nowrap; }
.JSmenuSubItem a:visited { color: #fff; font-size: 11px; padding: 3px; padding-left:10px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItem table td { color: #fff; background-color:#606060; font-size: 11px; padding: 3px; padding-left:10px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItemHover { background: #ebebeb; color: #000; padding: 3px; padding-left:10px; font-size: 11px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItemHover a { background: #ebebeb; color: #000000; font-size: 11px; padding: 3px; padding-left:10px; text-decoration: none; white-space: nowrap; }
.JSmenuSubItemHover a:hover { background: #ebebeb; color: #000; padding: 3px; padding-left:10px; font-size: 11px; text-decoration: none; white-space: nowrap; }

/*_____________________________________________________________________________________________________________________
		FRONT-END/BUYER'S SIDE STYLES
=======================================================================================================================*/
/*_________________________________________________________________________________
		SEARCH PAGES
===================================================================================*/
body#directory div#productSearch form input.text,
body#directory div#casSearch form input.text,
body#directory div#femaSearch form input.text,
body#directory div#nameSearch form input.text,
body#directory div#ingredientSearch form input.text,
body#directory form#ingredientSearch input.text,
body#directory form#nameSearch input.text,
body#directory form#productSearch input.text,
body#directory form#cbrIngredientInciSearch input.text,
body#directory form#casSearch input.text { display: inline; margin-bottom: 0px; }

/* ----- searches at the top - no border-top -------------------- */
body#directory div#ingredientNameSearch,
body#directory div#materialNameSearch,
body#directory div#nameSearch { padding: 10px 0px; }

/* ----- searches that come 2 or 3rd ---------------------------- */
body#directory div#claimsSearch,
body#directory div#categorySearch,
body#directory div#materialSearch,
body#directory div#inciSearch,
body#directory div#casSearch,
body#directory div#femaSearch,
body#directory div#functionSearch,
body#directory div#applicationSearch,
body#directory div#locationSearch,
body#directory div#productSearch,
body#directory div#ingredientSearch,
body#directory div#nameBrowse { padding: 10px 0px; border-top: 1px solid #999; }

body#directory div#nameBrowse { padding-bottom: 0px; }

body#directory div#claims { margin-top: 10px; }
body#directory div#claims ul {list-style-type: none; }

/* ----- Browse by Alpha ---------------------------------------- */
div#pagination a { display: inline-block; padding: 2px 4px; border: 1px solid #999; background-color: #cbcbcb; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; line-height: 12px; text-decoration: none; }
p.alphaBrowse { font-family: Arial, Helvetica, sans-serif;  }
p.alphaBrowse a.directory { display: inline-block; padding: 3px; border: 1px solid #999; background-color: #cbcbcb; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; line-height: 12px; text-decoration: none; text-align: center; min-width: 9px; }
div#pagination a:visited, p.alphaBrowse a.directory:visited { color: #666; }
div#pagination a:hover, p.alphaBrowse a.directory:hover { text-decoration: underline; color: #000; background-color: #d8d8d8; }
div#pagination b { font-size: 12px; line-height: 12px; padding: 2px; display: inline-block; }
div#pagination a b { font-weight: normal; padding: 0px; display: inline; }

/* ----- other search tweaks ------------------------------------ */
div#applicationSearch form#cbrFormulaApplicationSearch select { margin-top: 2px; }
div#applicationSearch form#cbrFormulaApplicationSearch input.submit { vertical-align: top; }

/* when on a suppliers products search page */
div#nameSearch form#supplierProductSearch,
div#nameSearch form#ffmProductNameSearch { margin-top: -10px; }

/* ----- REFINE SEARCH ON SEARCH RESULTS PAGE ------------------- */
body#directory div#searchForms { padding: 0px 10px; border: 2px solid #666; border-top-width: 0px; margin: 0px 0px 10px; }
body#directory div#searchForms h1 { display: none; }
body#directory p#refineSearch { font-family: Arial, Helvetica, sans-serif; border-top: 2px solid #666; display: block; text-align: right; margin: 3px 0px 0px; font-size: 13px; }

body#directory p#refineSearch span,
body#directory p#refineSearch a { padding: 4px 6px 5px; background-color: #666; line-height: 13px; font-size: 13px; color: #fff; float: right; font-weight: bold; text-decoration: none; border-style: solid; border-color: #666; border-width: 0px 2px; }

body#directory p#refineSearch a:hover { text-decoration: underline; }
body#directory p#refineSearch span { background-color: #bbb; border-left-color: #bbb; }
body#directory div#results h1 { margin-top: 5px; }

body.ffm div#searchForms { position: relative; }
body.ffm div#ffmIngSearches { width: 300px; }

/*_________________________________________________________________________________
		PICKER SCROLLING DIVS
===================================================================================*/
/* - this is for supplier registration when business types are originaly picked.  this needs to be coded like above with the .picker class */
/* - this is also used for adding a gci product - */
div#categoryOptions { border: 2px solid #999; padding: 0px; float: left; width: 394px; margin: 0px 10px 10px 0px; }
div.pickerWrapper { border: 2px solid #999; padding: 0px; width: 394px; }
div#main div.pickerWrapper { float: none; margin: 0px; }

/* -- this is for the expand all/collapse all links -- */
div#categoryOptions p, div.picker p { margin: 0px; padding: 5px; text-align: center; background-color: #ddd; border-top: 1px solid #999; }

body.si div#categoryOptions p a:link,
body.si div#categoryOptions p a:visited,
body.si div.pickerWrapper p a:link,
body.si div.pickerWrapper p a:visited { color: #5d776d; }

body.si div#categoryPicker p a:hover, body.si div.picker p a:hover { color: #06f; }

/* -- this is titles of these pickers - similar to the above p tags -- */
div#categoryOptions h3,
div.pickerWrapper h3 { margin: 0px; padding: 5px; background-color: #ddd; border-bottom: 1px solid #999; }

/*need to get rid of these as soon as locations picker */
div#categoryPicker { overflow: scroll; overflow-x: hidden; overflow-y: auto;  padding: 5px; height: 240px; }
div.picker { overflow: scroll; overflow-x: hidden; overflow-y: auto; padding: 5px; height: 240px; }
div#categoryPicker ul { list-style: none; position: static; margin: 0px; }
div#main div.picker ul { list-style: none; position: static; margin: 0px; }
div#categoryPicker ul li { padding-left: 15px; display: block; line-height: 18px; font-size: 14px; margin: 0px; }
div.picker ul li { padding-left: 15px; display: block; line-height: 18px; font-size: 14px; margin: 0px; }
div#categoryPicker ul li img { margin: 0px 3px 0px -15px; }
div.picker ul li img { margin: 0px 3px 0px -15px; }
div#categoryPicker ul li ul li { font-size: 12px; }
div.picker ul li ul li { font-size: 12px; }

/* these styles are to distinquish expandable parent links and sibiling links */
div#categoryPicker ul li.expandable a.expandableParentLink:link,
div.picker ul li.expandable a.expandableParentLink:link { text-decoration: none; }

body.gci div#categoryPicker ul li.expandable a.expandableParentLink,
body.gci div.picker ul li.expandable a.expandableParentLink { color: #ea6f00; }

body.si div#categoryPicker ul li.expandable a.expandableParentLink,
body.si div.picker ul li.expandable a.expandableParentLink { color: #5d776d; }

body.cbr div#categoryPicker ul li.expandable a.expandableParentLink,
body.cbr div.picker ul li.expandable a.expandableParentLink { color: #326076; }

body.ffm div#categoryPicker ul li.expandable a.expandableParentLink,
body.ffm div.picker ul li.expandable a.expandableParentLink { color: #e06500; }

/* - specific pickers that need special styles - */
body.si div#categoryPickercategories { height: 150px; }

/* - what you have picked */
div#pickedCategories { float: left; width: 425px; }
div#pickedCategories div#yourCategories { height: 228px; overflow: scroll; overflow-x: hidden; overflow-y: auto; padding: 10px 20px 10px 10px; width: 398px; border: 2px solid #999; }

div.optionsPicked { padding-top: 5px; position: relative; min-height: 40px; clear: left; }
div.optionsPicked h3 { margin: 0px; }
div.optionsPicked p#helpText { color: #999; margin: 5px; /*position: absolute; top: 20px; left: 5px; margin: 0px;*/ z-index: -100; }
div.optionsPicked div { z-index: 100; overflow: hidden; white-space: normal; position: relative; }
div.optionsPicked div#ids0 { margin-top: -21px; }

div.ddSelectedOption { background-color: #fff; border-top: 1px solid #ddd; font-family: Arial, Helvetica, sans-serif; margin: 0px; padding: 3px 0px; width: 398px; }

p.removeLink { float: right; margin: 0px 0px 0px 5px; height: 12px; text-decoration: none; font-size: 10.5px; line-height: 12px; }
p.removeLink a { text-decoration: none; }
p.category { margin: 0px; padding-right: 42px; }

div#categorySearch input.submit { margin-top: 1px; }

/*_________________________________________________________________________________
		SEARCH RESULTS TABLE STYLES
===================================================================================*/
div#searchResults table.tablesorter { font-family: Arial, Helvetica, sans-serif; background-color: #fff; margin:10px 0pt 15px; font-size: 12px; width: 100%; text-align: left; border-spacing: 1px; border-collapse: separate; }

div#searchResults table.tablesorter thead tr th,
table.tablesorter tfoot tr th { background-color: #ccc; border: 0px solid #FFF; font-size: 13px; padding: 4px; }

div#searchResults table.tablesorter tbody td { color: #3D3D3D; padding: 4px; background-color: #FFF; vertical-align: top; font-size: 12px; }
div#searchResults table.tablesorter tbody tr.odd td { background-color:#fff; }
div#searchResults table.tablesorter tbody tr.even td { background-color: #f0f2f6; }
div#searchResults table.tablesorter tbody tr.bold_listing td { font-weight: bold; background-color: #ff8; }

/*_________________________________________________________________________________
		AD STYLES - Not sure if i still need these
===================================================================================*/
div.ad { padding: 15px 0px 10px; border-top: 1px solid #000; margin: 0px; background: url("../images/shared/adLabel-h-blk.gif") 50% 4px no-repeat; }
div.ad img { border: 1px solid #000; }
div.ad div { margin: 0px; padding: 0px; overflow: hidden; display: inline-block; border: 1px solid #000; }
div.sponsoredLogo { width: 230px; text-align: center; background-color: #fff; padding: 10px; border: 1px solid #000; margin: 10px 0px; }

/* not sure if i still need these for the directory */
div#col3_content div#sponsorInfo { margin-top: 10px; border: 1px solid #000; background-color: #fff; padding: 5px; text-align: center; overflow: hidden; }
div#col3_content div#sponsorInfo h2 { text-align: center; }
div#col3_content div#sponsorInfo img { max-width: 240px; }
div#col3_content div#sponsorInfo h3 { display: inline-block; width: 100%; padding-top: 5px; border-top: 1px solid #000; margin: 10px 0px 2px; text-align: left; }
div#col3_content div#sponsorInfo p { margin: 5px 0px; text-align: left; }

div#main div#feedbackAd { width: 180px; margin: 20px auto; border: 3px solid #ccc; text-align: center; }
div#main div#feedbackAd h2 { width: auto; padding: 5px 5px 8px; color: #900; background-color: #ccc; }

/*_________________________________________________________________________________
		PREVEIW NOTE STYLES
===================================================================================*/
#previewNote { margin: 10px; padding: 5px 7px; border: 2px solid #fff; display: none; position: relative; z-index: 23; font-family: Arial, Helvetica, sans-serif; background-color: #ff8;
-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.5), 0px 0px 4px rgba(0,0,0,.2) inset; -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.5), 0px 0px 4px rgba(0,0,0,.2) inset; box-shadow: 0px 1px 2px rgba(0,0,0,.5), 0px 0px 4px rgba(0,0,0,.2) inset; }

#previewNote h2 { font-weight: bold; text-align: center; }
#previewNote p { margin-bottom: 5px; }
body.si #previewNote h2, body.si #previewNote p { color: #000; }

#col1_content div#loginForm { margin: -12px 10px 10px; padding: 12px 10px 0px; overflow: hidden; position: relative; z-index: 22; background-color: #fff;
-moz-border-radius: 0px 0px 5px 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-radius: 0px 0px 5px 5px;
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.5); -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.5); box-shadow: 0px 1px 2px rgba(0,0,0,.5); }

#col1_content div#loginForm.previewEnd { margin-top: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;  }

#col1_content div#signupForm { margin: -12px 10px 10px; padding: 12px 10px 0px; overflow: hidden; position: relative; z-index: 21; background-color: #fff;
-moz-border-radius: 0px 0px 5px 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-radius: 0px 0px 5px 5px;
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.5); -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.5); box-shadow: 0px 1px 2px rgba(0,0,0,.5); }

#col1_content div#signupForm p#signupNote { margin-top: 15px; }

/* si fixes */
body.si #previewNote, body.si #col1_content div#loginForm, body.si #col1_content div#signupForm { margin-left: 4px; margin-right: 4px; }
body.si #previewNote h2, body.si #previewNote p,  body.si #signupForm p { color: #000; }
body.si #col1_content div#loginForm p, body.si #col1_content div#previewNote p, body.si #col1_content div#signupForm p { margin-top: .5em; }
body.si #loginForm h2 { color: #41464b; margin-bottom: 10px; }
body.si #previewNote a:link, body.si #loginForm a:link, body.si #signupForm a:link { color: #5D776D; }
body.si #previewNote a:hover, body.si #loginForm a:hover, body.si #signupForm a:hover { color: #5aa1e2; }

/*_____________________________________________________________________________________________________________________
		DETAIL PAGE STYLES
=======================================================================================================================*/
p.backLink { border-bottom: 1px solid #999; margin: 0px 0px 5px 0px; padding-bottom: 5px; }

/* div.moreDetails is the right sidebar on all detail pages */
div.moreDetails { float: right; width: 200px; padding: 0px 0px 10px 10px; background-color: #fff; margin: 0px 0px 5px 5px; }
div.moreDetails img { margin-bottom: 10px; }
div.moreDetails h2 { margin-bottom: 5px; }

p.pdfLink { margin: 0px 0px 10px 0px; }
p.pdfLink a { background: url("../images/icons/pdf.gif") no-repeat 0 4px; display: inline-block; padding: 3px 0px 3px 20px; }
p.pdfLink a img { display: none; margin: 0px; }

p.requestLink { margin: 10px 0px; }
p.requestLink a { border: 1px solid #000; display: inline-block; text-decoration: none; height: 15px; line-height: 15px; padding: 3px; text-align: center; width: 120px; font-weight: normal; background-color: #ddd; color: #000; }
p.requestLink a:hover { text-decoration: underline; }

/*_________________________________________________________________________________
		SUPPLIER DETAIL PAGE STYLES - detail/supplier.html
===================================================================================*/
div.contact { padding-bottom: 7px; }
div.contact p { margin: 0px 0px 3px 0px; }
div.contact h3 { margin-bottom: 2px; }

div#supplierCategories { overflow: hidden; -moz-box-shadow: 1px 1px 3px rgba(0,0,0,.2); -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.2); }
div#supplierCategories div.scroller ul { list-style: none; margin: 5px 0px 0px; }
div#supplierCategories div.scroller ul li { margin-left: 0px; }

/*div.moreInfo are the scroller divs used for the different sections */
div.moreInfo { margin: 12px 0px 5px 0px; overflow: hidden; -moz-box-shadow: 1px 1px 3px rgba(0,0,0,.2); -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.2); }

div.moreInfo h2,
div#supplierCategories h2 { margin-bottom: 0px; padding-left: 8px; border: 2px solid #ccc; background-color:#d8dadf; border-bottom-width: 0px; line-height: 24px; }

div#main div.moreInfo dl { margin-top: 0px; }
div#main div.moreInfo dl dt { margin-top: 0px; font-weight: normal; }
div#main div.moreInfo dl dt a { font-weight: bold; }
div#main div.moreInfo dl dd { margin-bottom: 7px; color: #666; }

div.moreInfo div,
div#supplierCategories div { padding: 5px 5px 5px 10px; border: 2px solid #ccc; border-top-width: 0px; }

div.moreInfo div.scroller,
div#supplierCategories div.scroller { max-height: 130px; }

div#companyLocations, div#companyReps { clear: both; }

div#companyLocations div#locationList,
div#companyReps div#repList { padding: 5px 5px 5px 10px; border: 2px solid #ccc; border-top-width: 0px; max-height: 200px; overflow: scroll; overflow-x: hidden; overflow-y: auto; }

div#locationList table td,
div#repList table td { padding: 0px 10px 10px 0px; vertical-align: top; }

div#companyReps div.contact,
div#locationList div.contact { border-width: 1px 0px 0px 0px; padding: 5px 0px 0px 0px; }

/*_________________________________________________________________________________
		CBR DETAIL PAGE STYLES
===================================================================================*/
/* ----- INCI Detail Page: detail/inci.html --------------------- */
table#inciSpecs { width:237px; margin: 0px 0px 10px 0px; border-collapse: separate; border-spacing: 0px; border-top: 1px solid #95989a; }
table#inciSpecs td { padding: 2px 0px; border-bottom: 1px solid #95989a; margin: 0px; font-size: 11.5px; line-height: 16.5px; }
table#inciSpecs td.label { width: 130px; padding-right: 7px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #000; }

/* ----- FORMULA Detail Page: detail/formula.html --------------- */
div#formula { clear: both; }
div#formula table { width: 100%; border-collapse: separate; margin-bottom: 10px; border-spacing: 0px; }
div#formula table.phase thead th { background-color: #999; padding: 5px 10px; text-align: left; font-size: 14px; line-height: 16px; }
div#formula table.phase td  { padding: 5px 10px; border-color: #999; border-style: solid; font-size: 12px; }
div#formula table.phase td.ingredient { text-align: left; border-width: 0px 0px 1px 1px; }
div#formula table.phase td.amount { text-align: right; border-width: 0px 1px 1px 0px; min-width: 100px; vertical-align: middle; }
div#formula table.phase tbody tr.even td { background-color:#e0e0e0; }
div#formula table#formulaTotal { margin-top: -10px; }
div#formula table#formulaTotal td { border: 0px; font-weight: bold; padding: 5px 10px; font-size: 12px; }
div#formula table#formulaTotal td.amount { text-align: right; min-width: 100px; vertical-align: middle; }

/*_________________________________________________________________________________
		FFM DETAIL PAGE STYLES
===================================================================================*/
/* ----- Product Detail Page: detail/ffmProduct.html ------------ */
div#productMaterialListing { padding-top: 10px; border-top: 2px solid #999; clear: both; overflow: hidden; }

/* ----- Material Detail Page: detail/ffmMaterial.html ---------- */
table#materialSpecs { width:237px; margin: 0px 0px 10px 0px; border-collapse: separate; border-spacing: 0px; border-top: 1px solid #95989a; float: left; }
table#materialSpecs td { padding: 2px 0px; border-bottom: 1px solid #95989a; margin: 0px; font-size: 11.5px; line-height: 16.5px; }
table#materialSpecs td.label { width: 130px; padding-right: 7px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #000; }
img#moleculeStructure { margin-left: 10px; max-width: 340px; }
div#ffIngredients { clear: left; }

/*_________________________________________________________________________________
		EDIT BUYER PROFILE PAGE STYLES
===================================================================================*/
p#profileNav { width: 200px; margin: 0px 0px 0px 10px; text-align: right; float: right; }

/* ffm Edit Profile page for users who manage other user accounts */
div#ffmUsers { margin-bottom: 10px; border: 2px solid #ccc; }
div#ffmUsers table { margin: 0px; padding: 0px; width: 100%; }
div#ffmUsers table thead th { padding: 3px 10px; background-color: #d8dadf; text-align: left; }
div#ffmUsers table tbody td { padding: 3px 10px; border-top: 1px solid #ccc; }