/*
	The primary blocks on every page:  the navbar, the pageContent, the pageFooter,
	and the pageBody which contains all of these.  Also the title bar displayed at
	the top of the pageContent.
*/
/* Removing body width due to wrapping issue on some browsers. JAF 06.02.2008 */
/*	width: 800px; */
DIV#pageBody {
	padding-bottom: 5px;
	min-width: 800px;
}

/* 
	Navigation bar contains links used to navigate within the site.
	It is located on the left side of the screen, floating to the left of the page content. 
*/
#navbar {
	width: 120px;
	padding-left: 3px;
	float: left;
}

/* 
	Page content appears to the right of the navbar. The left margin ensures this. 
	It has an explicit preferred width, so that the page will be no wider than the
	top banner graphic if possible.  But overflow is supported in the case of wide 
	content, such as tables.  There is also a small margin at the top, to allow for
	a bit of space between the page title and the beginning of the content.
	A minimum height is specified, so that, for pages with minimal content, there is
	a reasonable gap between the content and the page footer.
*/
#pageContent {
	width: 870px;
	min-width: 870px;
	margin-left: 125px;
	overflow: visible;
	margin-top: 15px;
	min-height: 250px;
}

DIV#loggedInUser {
	width: 870px;
	top: 132px;
	left: 125px;
	position: absolute;
	text-align: right;
}

#pageFooter {
	padding-top: 10px;
	margin-left: 125px;
	text-align: center;
	width: 870px;
	clear: both;
	color: #999999;
	font-style: italic;
	font-size : 11px;
}

/* Background image removed per request 9/18/2007 JAF */
/* background-image: url("../images/titlebar.JPG"); */
#titlebar {
	width: 870px;
	height: 18px;
	background-repeat: no-repeat;
	font-size: larger;
	font-weight: bold;
	margin-top: 5px;
	margin-left: 125px;
	text-align: left;
}

/* The place order button appearing to the right of the title bar. */
DIV#titlebarbutton {
	position: absolute;
	left: 713px;
}

/* The program title for program information pages. */
.programTitle {
	font-weight: bold;
	font-size: large;
	color: black;
}

SPAN.label-error
{
  color: Red;
}

.alertButton {
        width: auto;
        border: none;
        background-color: #699ED9;
        color: #fff;
        padding: 0.1em;
        border-bottom: 1px solid #5885b6 !important;
        border-right: 1px solid #5885b6 !important;
        border-top: 1px solid #92b8e2 !important;
        border-left: 1px solid #92b8e2 !important;
        cursor: hand;
        cursor: pointer;
}

.alertDialog {
    width: 30em;
    border: 2px solid #ff660a;
    padding: 1em;
    background: #ffffff;
    -moz-border-radius: 10px;
}

.alertContent .alertButton {
    float:right;
    position:relative;
    bottom:1em;
}

.missingList, .invalidList {
    padding-bottom: 0.6em;
    padding-top: 0.2em;
    padding-left:0.1em;
    padding-right:0.2em;
    margin: 0;
}

.missingList {
    border-top: 4px solid #bedef4;
}

.invalidList {
    border-top: 4px solid #ffaf7e;
}

.missingList li, .invalidList li {
    list-style:none;
    font-style:italic;
}

/*
	Used for images which serve as buttons.
*/
.imageButton {
	cursor: pointer;
}

label.error {
	color: red;
	font-style: oblique;
}

.field-error
{
  color: White;
  background-color: Red;
}

SPAN.cartLink {
	margin-top: 4px;
	padding: 3px;
	border: thin solid #8888EE;
	color: #8888EE;
	text-decoration: none;
	vertical-align: middle;
}

SPAN.userIdentification {
	text-align: right;
	color: #9999FF;
}

A.cartlink {
	text-decoration: none;
}

DIV.error  {
	font-weight : bold;
	color : Blue;
	border-color : Red;
	border-style : solid;
	border-width : 2px;
	padding : 4px;
	width : 90%;
	text-align : left;
}

DIV.message  {
	font-weight : bold;
	color : Blue;
	border-width : 1;
	border-color :	Blue;
	border-style : solid;
	padding : 4px;
	width : 90%;
}

DIV.warning {
	font-weight : bold;
	color : #ffa500;
	border-color : #ffa500;
	border-style : solid;
	padding : 4px;
	width : 90%;
	text-align : left;
	border-width : 2px;
}

DIV.dealerMessage  {
	font-weight : bold;
	color : Red;
	border-width : 1;
	border-color :	Red;
	border-style : solid;
	padding : 4px;
	width : 90%;
}

SPAN.error  {
	font-weight : bold;
	color : Blue;
}
SPAN.message  {
	font-weight : bold;
	color : Blue;
}
SPAN.dealerMessage  {
	font-weight : bold;
	color : Red;
}
TABLE.inputerror TD.message
{
  font-weight: bold;
  font-size: smaller;
}

TABLE.content
{
	background-color: #ffffcc;
  	border-color : Black;
	border-style : solid;
	border-width : thin;
	border-top-width : 0px;
	border-bottom-width : 2px;
	border-right-width : 2px;
	border-left-width : 0px;
	font-size : smaller;
	clear: all;
	width: 700px;
}


TABLE.tabs TD
{
  padding: 0px;

}

BODY
{
  background-color: #FFFFFF;
  margin: 0;
  padding: 0;
}

body, td {
  font-family: Arial, Lucida Grande, Tahoma, Verdana, sans-serif;
  font-size: 12px;
}

th {
  font-family: Arial, Lucida Grande, Tahoma, Verdana, sans-serif;
  font-size: 9pt;
  background-color: #89BAF7;
}

INPUT { 
  font-family: Arial, Lucida Grande, Tahoma, Verdana, sans-serif;
  font-size: 12px;
}

SELECT
{
	  font-family: Arial, Lucida Grande, Tahoma, Verdana, sans-serif;
  	  font-size: 12px;
	}

TABLE.requestDebug
{
	width: 700;
  	border-color : Black;
	border-style : solid;
	border-width : thin;
	border-top-width : 0px;
	border-bottom-width : 2px;
	border-right-width : 2px;
	border-left-width : 0px;
	background-color: #839cd1;
	padding: 0;
}

TABLE.requestDebug TR.control
{
    font-weight: bold;
    font-size: 9pt;
	color : White;
	background-color : #330066;
}

TABLE.requestDebug FORM
{
  margin: 0;
}

DIV.described-object-title
{
  font-size: large;
  font-weight: bold;
  color: white;
  background-color: black;
}

TABLE.described-object  
{
  border: 1px solid black;
  width: 100%;
}


TABLE.described-object TR.section TH
{
  color: white;
  background-color: black;
  text-align: center;
}

TABLE.described-object TR.odd
{
  background-color: silver;
}

TABLE.described-object TR.even
{
  background-color: #839cd1;
}

TABLE.described-object TH
{
  text-align: right;
  width: 1px; // Will stretch to fit.
}

TABLE.form TR
{
   vertical-align: top;
}

TABLE.form TH
{
   font-weight: bold;
   text-align: right;
}

TABLE.form TR.column-header TH
{
	font-weight: bold;
	text-align: center;
}

TABLE.palette TH
{
  font-size: 9pt;
  font-weight: bold;
  color: white;
  background-color: #330066;
  text-align: center;
}

TABLE.palette SELECT
{
  font-weight: bold;
  background-color: #839cd1;
  width: 200px;
}

TABLE.palette TD.controls
{
   text-align: center;
   vertical-align: middle;
   width: 60px;
}

TABLE.form
{
  font-size: 9pt;
}

A.nav
{
  font-family: Trebuchet MS,sans-serif;
  text-decoration:none;
  font-size: 12px;
  font-weight: bold;
  color: black;
}

PRE
{
  font-family: Arial, Lucida Grande, Tahoma, Verdana, sans-serif;
  font-size: 7pt;
}

UL 
{
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
}

IMG
{
  border: none;
}

.activeSubLink {
    color:#000 !important;
	font-size: 8pt;
	font-weight:bold;
	cursor: pointer;
	background-color: #dddddd;
	width: 82px; 
	max-width: 82px;
	min-width: 82px;
	padding-left: 30px;
	padding-top: 3px;
	padding-bottom: 3px;
	text-indent: -15px;
}

.inactiveSubLink {
    color:#0066cc !important;
	font-size: 8pt;
	font-weight:bold;
	cursor: pointer;
	background-color: #eeeeee;
	width: 82px; 
	max-width: 82px;
	min-width: 82px;
	padding-left: 30px;
    padding-top: 3px;
	padding-bottom: 3px;
	text-indent: -15px;
}

.currentSubLink {
    color:#000 !important;
	font-size: 8pt;
	font-weight:bold;
	cursor: pointer;
	background-color: #dddddd;
	width: 82px; 
	max-width: 82px;
	min-width: 82px;
	padding-left: 30px;
	padding-top: 3px;
    padding-bottom: 3px;
    text-indent: -30px;
}


/* 
	Identifies the currently selected dealer, for when a CSR is acting as a delegate for that dealer.
*/
.dealerIdentification {
		color: blue; font-weight: bold;
}

/*
	Style for the customer service link appearing on all pages below the navbar buttons.
*/
.customerService {
		font-size: 7pt;
		color: #3333FF;
		line-height: 15px;
}

/*
	The styles for the small login form.
*/
TABLE.smallLoginForm {
		border: 3;
		border-color: blue;
		border-style: double;
}

TABLE.smallLoginForm LABEL {
	font-size: 7pt;
}

TABLE.smallLoginForm TD {
	font-size: 7pt;
}

TABLE.smallLoginForm TH {
	color: white;
}

TABLE.smallLoginForm INPUT {
	font-size: 7pt;
}

/*
	The styles for the regular size login form.
*/
TABLE.loginForm {
		border: 3;
		border-color: blue;
		border-style: double;
}

/*
	Alternating row styles for data tables.
*/
.detailsRow1 {
		background-color: #FFFFFF;
}

.detailsRow2 {
	background-color: #DDDDDD;
}

.columnTotals {
	font-weight: bold;
	border-top: solid;
}

TR.even {
	background-color: #FFFFFF;
}

TR.odd {
	background-color: #DDDDDD;
}

/*
	Style for data tables.
*/
TABLE.details TD {
		font-size: 10px;
		word-wrap: break-word;
		text-overflow: ellipsis;
}

TABLE.details TH {
	word-wrap: break-word;
	text-overflow: ellipsis;
}

TABLE.details TR.even {
	background-color: #FFFFFF;
}

TABLE.details TR.odd {
	background-color: #DDDDDD;
}

/*
	Styles used for Outstanding Cores page.
*/
.coreGreen {
	border-bottom-color: #00FF00;
	border-bottom-width: 10px;
	border-bottom-style: solid;
	white-space: nowrap;
	height: 20px;
}

.coreYellow {
	border-bottom-color: yellow;
	border-bottom-width: 10px;
	border-bottom-style: solid;
	white-space: nowrap;
	height: 20px;
}

.coreRed {
	border-bottom-color: red;
	border-bottom-width: 10px;
	border-bottom-style: solid;
	white-space: nowrap;
	height: 20px;
}

.requiredFieldAsterisk {
	color: red;
}


/*
	The following are used for FAQ display.
*/

.faqQuestionLabel {
	font-weight: bold;
}

.faqAnswerLabel {
	font-weight: bold;
}

.faqQuestionText {
}

.faqAnswerText {
}

/*
	The following are used for drill down tables under 'details' style tables.
*/
TABLE.details TD TABLE.subdetails TD {
	font-size: 8pt;
}
TABLE.details TD TABLE.subdetails TR.even {
	background-color: #FFFFCC;
}

TABLE.details TD TABLE.subdetails TR.odd {
	background-color: #99DDDD;
}

.notShown {
	display: none;
}

.resultCount {
	padding-top: 5px;
	font-style: italic;
}

.filterResult {
	border: 1px solid black;
	position: absolute;
	height: 200px;
	background-color: white;
	overflow: scroll;
	z-index: 999;
}

.filterResultItem {
	white-space: nowrap;
}

.filterResultLabel {
  font-size: 10px;
  margin-left: 15px;
}

.filterResultValue {
  font-size: 12px;
}

DIV#CoreReturnInstructionsAlert {
	position: absolute;
	left: 480px;
	top: 180px;
	border: 2px solid red;
	color: red;
	text-align: center;
	font-weight: bold;
	width: 230px;
	height: 154px;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 10px;
}

.paginationNavButton {
	border: 1px solid black;
	background-color: #99CAFF;
	padding: 3px;
}


/* --------------------------- Upgraded UI --------------------------- */

.add-line-5{height:5px}
.add-line-10{height:10px}
.add-line-20{height:20px}
.add-line-30{height:30px}
.add-line-40{height:40px}
.add-line-50{height:50px}


.logo-title-header {
    background-image: url("images/banner/mazda-corebloc-top-banner-mazda-5-v6.jpg");
    background-repeat: no-repeat;
    background-color: #2b2b2b;
}

.top-header-section {
    background-color: #2b2b2b;
    width:100%;
    height:125px;
}

.logo-image {
    padding: 10px 16px 10px 6px;
    text-align: left;
}

.logo-divider {
    border-right: 2px solid #d5d5d5;
    height: 90px;
}

.logo-text {
    padding-left:16px;
    width:auto;
    color:#d5d5d5;
    line-height:1.25;
    font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:19px;
    font-size:1.9em;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:.2em;
    cursor:default;
    vertical-align: middle;
}

.section-title{
    background-color: #ddd;
    padding: 5px 3px 3px 10px;
    width: 860px;
    letter-spacing:.2em;
    text-transform:uppercase;
    font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:13px;
    font-weight:700;
}

.message-title {
	margin-left: 10px;
	margin-top: 20px;
	letter-spacing:.1em;
	text-transform:uppercase;
	font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:12px;
    font-weight:700;
}

.message-text {
	margin-left: 40px;
    letter-spacing:.05em;
    font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:12px;
    font-weight:400;
}

.warning-text {
    margin:10px;
    letter-spacing:.05em;
    font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:13px;
    font-weight:400;
}

.important-text {
	color:red
}

.mazda-type{
    font-family:"Mazda Type",helvetica,arial,sans-serif;
}

.page-title {
	letter-spacing:.2em;
	text-transform:uppercase;
	font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:14px;
    font-weight:700;
    color:#333;
}

.login-user-info {
	letter-spacing:.1em;
	text-transform:uppercase;
	font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:13px;
    font-weight:400;
    color:#666;
}

.login-title {
	letter-spacing:.1em;
	text-transform:uppercase;
	font-family:"Mazda Type",helvetica,arial,sans-serif;
    font-size:13px;
    font-weight:700;
    text-align:right;
    color:#555;
}
