/**
 * STRUCTURAL SHEET
 *  Encourages the author to ask “what role does this piece of the document play?” Rather 
 *  than obsess over the visual placement of the navigation links, structural naming gets 
 *  authors to consider the document structure. Examples: #dealer-happylink
 *
 * FILE:    Content Stylesheet
 * DESC:    This stylesheet will handle the formatting of specific page objects. There should not be any
 *          page layout styles listed here.
 *
 */

/* Suggested order:
 * display
 * list-style
 * position
 * float
 * clear
 * width
 * height
 * margin
 * padding
 * border
 * background
 * color
 * font
 * text-decoration
 * text-align
 * vertical-align
 * white-space
 * other text
 * content
 */

/* TOC:
   Random HTML Styles
     Forms
   General Structure
   Navigation
   Quotations
   Comments and Other Asides
   Emphasis
   Examples and Figures
   Q and A (FAQ)
   Tables
   Headers
   Meta
   Specific to Products Pages
*/

/* Random HTML Styles */
    dt {
		font-weight: bold;
	}
	
	dd {
		margin: 0 0 1em 1em;
	}
	
	li {
		margin-top: 0.2em;
		margin-bottom: 0.2em;
		font-size:8pt;
	}
	
	sup {
		font-size: 70%;
	}

	form {
		margin: 0;
		display: inline;
	}
	
	input 
	{
	    font-size:8pt;
	    
	}

	label {
		font-weight: bold;
	}
	
	td 
	{
	    font-size:8pt;   
	}
	

/* General Structure */
	
	.subtitle {
		font-style: italic;
	}

	div.para {
		margin: 1em 0;
	}

	div.para > ul,
	div.para > ol,
	div.para > blockquote {
		margin-top: 0.2em;
		margin-bottom: 0.2em;
	}

	div.section {
		display: block;
		padding-left: 3%;
	}

	div.section > h2,
	div.section > h3,
	div.section > h4,
	div.section > h5,
	div.section > h6 {
		margin-left: -1.3%;
	}
	
	.block {
	  display: block;
	  margin: 0.1em 1em;
	}
	
	.imgright {
		float: right;
		margin: 0 0 2em 2em;
	}
	
	.first {
		margin-top: 0; /* For IE not understanding first:child */
	}

/* Navigation */

    .previewbox img,
    .previewbox a img
    {
        border:#003366 solid 1px;
    }

	:link img,
	:visited img {
		/*border: 0;*/
	}
	.deepLevel #mainContent :link img,
	.deepLevel #mainContent :visited img {
		border: medium solid;
	}
	.deepLevel #mainContent #buttons :link img,
	.deepLevel #mainContent #buttons :visited img {
		border: 0;
	}

	.ex-ref {
		font-style: italic;
	}

	dl.toc dt {
		margin-top: 1em;
		font-size: 110%;
	}
	dl.toc p {
		margin: 0;
		text-indent: 1em;
	}
	dl.toc p:first-child {
		text-indent: 0;
	}
	dl.toc > dd {
		margin-left: 1em;
	}

	ol.toc ol {
		list-style-type: circle;
	}
	ol.toc > li > ol {
		font-size: 90%;
	}

	ul.snav {/* section navigation or short navigation, whichever you prefer */
		margin: 0.7em 10%;
		padding: .2em;
		text-align: center;
		list-style-type: none;
	}
	ul.snav > li {
		margin: 0;
		padding: 0;
	}
	ul.snav > li {
		display: inline;
	}
	ul.snav > li:before {
		content: " | ";
	}
	ul.snav > li:first-child:before {
		content: "";
	}

	a.cont {
		display: block;
		margin-right: 0;
		text-align: right;
	}

/* Quotations */

	blockquote > address {
		padding-left: 1em;
		text-indent: -1em;
	}
	blockquote > address:before {
		content: "\2015";
	}

	div.quote,
	div.epigraph {
		margin: 1em;
	}
	div.quote q,
	div.epigraph q {
		display: block;
		margin: 0 .5em;
		text-indent: -0.5em;
	}
	div.quote cite,
	div.epigraph cite {
		display: block;
		padding: 0 1em;
		text-align: right;
		text-indent: -1em;
	}
	div.quote cite:before,
	div.epigraph cite:before {
		content: "\2015";
	}

	blockquote.epigraph,
	div.epigraph q {
		font-style: italic;
		text-align: right;
	}
	blockquote.epigraph em,
	div.epigraph q em {
		font-style: normal;
	}
	blockquote.epigraph address,
	div.epigraph cite {
		font-style: normal;
	}

/* Comments and other Asides */

	.note {
		font-style: italic;
	}
	.note:before {
		content: "Note: ";
	}

	.remark {
		font-size: smaller;
	}
	.remark:before {
		content: "[";
	}
	.remark:after {
		content: "]";
	}

	.sidenote {
		clear: both;
		margin: 0.75em 0.5em;
		padding: 0.2em;
		border: 1px solid;

		/* Block NS4 from floating */ /*/*/
		float: right;
		width: 30%;
		min-width: 15em;
		/* */
	}
	/* Reduce main header sizes */
	.sidenote h1 {font-size: 1.40em;}
	.sidenote h2 {font-size: 1.25em;}
	.sidenote h3 {font-size: 1.10em;}


/* Emphasis */

	/* em, strong */

	strong.stronger {
		font-style: italic;
		font-weight: bold;
	}

	strong.very-strong {
		font-weight: bold;
		text-transform: uppercase;
	}

	*.important,
	div.important,
	p.important {
		margin: 1em;
		padding: 0.1em;
		border: solid #F00;
		font-size: larger;
	}
	
	span.important {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: smaller;
		color: #c00;
	}


/* Examples and Figures */

	.example {
		margin: 1em 3%;
		padding: .25em;
		border: solid;
	}
	.example:before {
		display: block;
		font-weight: bold;
		content: "Example";
	}
	.example[title]:before {
		content: "Example: " attr(title);
	}


	.figure,
	.screenshot {
		display: block;
		margin: .75em auto;
	}
	object.figure object,
	object.screenshot object,
	object.figure img,
	object.screenshot object {
		display: block;
		margin: 0 auto;
	}
	.screenshot[title]:after,
	.figure[title]:after {
		display: block;
		margin: 0 8% .05em;
		font-style: italic;
		font-size: small;
		text-align: right;
		content: attr(title);
	}

	.co,
	.callout {
		text-decoration: underline;
	}

/* Q and A (FAQ) */

	.qandaset .question {
		font-size: large;
		font-weight: bold;
	}

	.qandaset .answer {
		margin-top: 1em;
	}

/* Tables */

	table.data {
		border-collapse: collapse;
		margin: 0.5em auto;
		border: 1px solid;
	}

	table.data caption {
		margin: 1em auto 0.2em;
		font-size: small;
		font-style: italic;
		text-align: center;
	}

	table.data th,
	table.data td {
		padding: 0.2em;
		border: 1px solid;
		vertical-align: baseline;
	}

	table.data tbody th:first-child {
		text-align: right;
	}

	table.data thead th {
		vertical-align: bottom;
	}

/* Meta */

	address {
		text-align: right;
	}
	.author {
		margin-bottom: 1em;
		text-align: left;
	}


/* Headers */

	#mainContent > h1:first-child,
	#mainContent > h2:first-child,
	#mainContent > h3:first-child,
	#mainContent > h4:first-child,
	#mainContent > h5:first-child,
	#mainContent > h6:first-child,
	#side > h1:first-child,
	#side > h2:first-child,
	#side > h3:first-child,
	#side > h4:first-child,
	#side > h5:first-child,
	#side > h6:first-child {
		margin-top: 0;
	}
	

/* Specific to Products Pages */

.productlist {
	margin: 0;
	padding: 0 0 0 5px;
}

.productlist li {
	clear: left;
	list-style: none;
	padding: 0 0 1em 0;
	margin-left: 0;
	background-image:URL(../../images/navbar/body_back.gif);
	border-bottom:#999 solid 1px;
	border:#999 solid 1px;
    margin:3px;
    padding:2px;
}

.flowlayout .productlist li 
{
    float:left;
    width:300px;   
    clear:none;
    border:#999 solid 1px;
    margin:3px;
    padding:2px;
}

.productlist li a img 
{
    border:#777 solid 1px;
}

.productlist h3 {
	margin: 0 0 0.2em 0;
}

.productlist h5 {
	margin: 0 0 0.2em 0;
}

.productlist li h4
{
    background-color:#DDE;
    width:100%;   
    border-bottom:#CCD solid 1px;
    margin:0px;
    padding:2px;
}

.productlist img, .productlist img:VISITED {
	float: left;
	margin: 0 0.5em 1em 0;
	border:#999 solid 1px;
}

.photolist img
{
    float:left;
    border:#777 solid 1px;
    margin:2px;
    cursor:hand;
}
.photo img
{
    border:#777 solid 1px;
    margin:2px;
    cursor:hand;
}

/* Body */

	body {
		
		text-align:center;
		font:normal 8pt 'Trebuchet MS';
	}

	#mainContent, #side {
		background: #fff;
		line-height: 1.3; /* value other than 'normal' needed for WinIE */
		color: #000;
		
	}
	.deepLevel #mainContent {
		line-height: 1.4;
	}

	#nav {
		line-height: 1em;
	}

/* Random HTML Styles */

	hr {
		height: 1px;
		background-color: #000;
		color: #000;
		margin: 0.2em 0;
	}

	input[type="submit"] {
		font-weight: bold;
	}
	
/* ************************** */
/* ************************** */
/* ************************** */
/* ************************** */

/* General Structure */
    body, td, th, input { /* redundant rules for bad browsers  */
            font-family: 'Trebuchet MS', verdana, sans-serif;
            font-size: x-small;
            voice-family: "\"}\"";
            voice-family: inherit;
            font-size: small;
    }
    
   
    th 
    {
        text-align:left; 
        color:#555;
        font-size:8pt;
        vertical-align:top;
    }
    
    td 
    {
        font-size:8pt;
        
    }

	h1, h2, h3, h4, h5, h6 {
		margin: 0.4em 0 0.4em 0;
		border-bottom: 3px inset #29568f;
		font-family: verdana, sans-serif, 'Trebuchet MS', arial;
	}
	
	h1, h2, h3, h4, h5, h6 {
		margin: 1em 0 0.2em 0;
		border-bottom: 1px solid #ccc;
		font-family: arial, verdana, sans-serif;
	}
	
	li h1, li h2, li h3, li h4, li h5, li h6 {
		border: none;
	}

	#header h1, #header h2, #headersales h1, #headersales h2{ border: 0; }
   

	h1 { font-size: 180%; font-weight: bold; }
	
	h2 
	{
	    font-size: 140%; 
	    font-weight: normal; 
	    font-family: verdana, sans-serif;
	    color:#fff;
	    background-image:URL(../../images/template/blueheader_bgc.gif);
	    padding:6px;
	    border-bottom: 1px solid #000;
	    font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	}
	h3 
	{
	    font-size: 120%; 
	    font-weight: bold; 
	    font-family: verdana, sans-serif;
	    color:#555;
	    /*background-image:URL(../../images/layout/blueheader_bgc.gif);*/
	    
	    border-bottom: 1px solid #000;
	    border-bottom: 1px solid #ccc;
	}
	
	h4 
	{
	    font-family:Tahoma,arial;
	    font-size: 100%;
	    font-weight: bold; 
	    color:#FFF;
	    background-image:URL(../../images/template/redheader_bgc_dk1.gif);
	    border-bottom: 1px solid #fff;
	    padding:2px;
	    padding-bottom:3px;
	}
	    
	h5 { font-size: 90%;  color:#29568f;}
	h6 { font-size: 90%; border: 0; }
	
/* Navigation */

         :link { color: #2956cf; }
         :visited { color: #2956cf; }
        /* :link:hover, :visited:hover { color: #333; }*/
        /* :link:active, :link:active { color: #000; }*/

/* Quotations */


/* Comments and other Asides */
    .frm-2col dl 
    {
           width:50%;
            float:left;
    }
    .frm-3col dl 
    {
           width:33%;
            float:left;
    }
    .frm-4col dl 
    {
           width:25%;
            float:left;
    }
    .frm-5col dl 
    {
           width:20%;
            float:left;
    }
    .frm-2col dl dt,
    .frm-3col dl dt,
    .frm-4col dl dt,
    .frm-5col dl dt
    {
        color:#29568f;   
        
    }
    
   /*Qualifier*/ 
   .formContent 
   {
	background-color:#EEE;
   }
   
    .formRow 
    {
	width:100%;
    }
    
    .formColumn 
    {
	float:left;
	width:100%;
	margin-bottom:6px;
    }
    .formColumn4Rows 
    {
	float:left;
	width:5%;
	margin-bottom:6px;
    }

    .formInputLabel
    {
	width:20%;
	height:12pt;
	float:left;
	color:Maroon;
	text-align:left
    }

    .formInput 
    {
    text-align:left;    
	width:60%;
	height:18pt;
	float:left;
    }
    
    .formTextArea 
    {
	width:200px;
	height:30pt;
	float:left;
    } 
    
    .legendTitle
    {
        font-weight:bold;
        font-size:large;
        color:Maroon
    } 
    
    .formInputPhone
    {
	margin-left:1px;
	margin-right:1px;
	float:left;
	height:12pt;
     } 
     
    .formButtons
    {
	margin-left:1px;
	margin-right:1px;
	text-align:center;
	height:12pt;
     }      
     
     hr.CustomerForm
     {
        border-bottom-style: dashed        
     } 
     
     .errorlabel
     {
        color:Maroon;
        font-weight:bold
        
        
     }
     .IncomeSource
     {
        float:left;
        color:Maroon;
        text-align:left
     }
     
     .CreditButton
     {
        float:left;
        margin-left:2px;
        width:100px;
     }
     
     .SDNLabel
     {
        color:Maroon;
        font-weight:bold
     }
     
     .AltRowStyle
     {
        background-color:#CCCCCC;
        vertical-align:top
     }
     
     .HeadStyle
     {
        background-color:#CCCCCC;
        border:#999 solid 1px;
         
        color:Maroon
     }
     .RowStyle
     {
        vertical-align:top;
        border:solid #EEEEEE 1px;
     }

   /*End Qualifier*/ 
   
    .simplelist dl 
    {

    }
    
    .simplelist dt
    {
        float:left;
        width:8em;
        font-weight:bold;
        color:#777;
    }
    .simplelist dd
    {
        
        margin:0px;
        padding:0px;
        color:#444;
    }
    

	.note {
		color: #666;
		font-style: normal;
	}
	
	.remark {
		color: #666;
	}
	
	.sidenote {
		border: #666;
	}
	
	.news dt {
		font-weight: normal;
		color: #666;
	}
	.news dt a {
		font-weight: bold;
	}
	
	ul.compact {
		margin-left: 0;
		padding-left: 20px;
	}
	
	.key-point:before {
		line-height: 0.1;
		font-size: 1px;
		background: transparent url("../../images/key-point_tr.gif") no-repeat top right;
		margin: -15px -15px 0 -15px;
		height: 15px;
		display: block;
		border: none;
		content: url("../../images/key-point_tl.gif");
	}
	.key-point {
		background: #e4ecec url("../../images/key-point_back.gif") right repeat-y;
		padding: 15px;
		margin-bottom: 1em;
	}
	.key-point:after {
		display: block;
		clear: both;
		padding-top: 15px;
		line-height: 0.1;
		font-size: 1px;
		content:  url("../../images/key-point_bl.gif");
		margin: -15px;
		height: 8px;
		background: transparent url("../../images/key-point_br.gif") scroll no-repeat bottom right ;
	}
	
	.key-point h2, .key-point h3, .key-point h4, .key-point h5 {
		border: none;
		margin-top: 0;
		color: #4C5C5C;
	}
			
/* Emphasis */


/* Examples and Figures */

	div.example {
		border-color: #554FA0;
	}
	div.example:before {
		color: #666;
	}

/* Q and A (FAQ) */

ol.faq li a {
	text-decoration: none;
	border-bottom: 1px dotted #6C98EE;
}

ol.faq li a:hover {
	border-color: #039;
}

	
/* Tables */

	table.data thead th {
		background: #e4ecec;
		empty-cells: hide;
	}

	table.data th,
	table.data td {
		border: 1px solid #ccc;
	}
	
	tr.odd {
		background: #F5F5F5;
	}

/* Meta */

	address {
		color: #666;
	}

/* Product Specific CSS */
	
	.productlist h3 {
		border: none;
	}
	
	.preQual 
	{
	    font-size:130%;   
	    font-weight:normal;
	}
	
	/* Login page */
	.LoginBox {
            font:normal 8pt 'Trebuchet MS';
            border:#777 solid 1px;
            background-color:#FFF;
			margin:auto;
        }
        
        .LoginBoxTitle {
            background-image:URL(../../images/Layout/breadcrumbs-background.png);
            
        }


    .header {
        background-color:#036;
        color:#FFF;
        font-weight:bold;
    }
    
    .header INPUT {
        border:0px;
    
    }
    
    .optionList {
        
    }
    
    .ro dl{
        background-color:#CCC;
        
    }
    
    dt 
    {
        font-size:8pt;
        font-family:Tahoma;   
    }

.s_navibg a { background:url(images/s_navibg.gif);display:block; width:180px; height:20px; font: bold 11px Tahoma;color:#2758A7;padding:7px 0 0 30px;text-decoration:none;}
.s_navibg a:hover { background:url(images/s_navibgh.gif);display:block; width:180px; height:20px; font: bold 11px Tahoma;color:#2758A7;padding:7px 0 0 30px;}
.s_text { padding:8px 0 0 30px;font: bold 11px Tahoma;color:#2758A7;}
.s_navigation { background:url(images/s_navigation.gif);display:block; width:210px; height:31px;}
.sidebar{ border-right: 1px solid #A7C9F5;width:212px; }
.content {width:100%;}

/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

/* ***** don't change the following ***** */
form { display: inline; }
label { cursor: default; }
.normal { font-weight: normal; }
.inlineimg { vertical-align: middle; }

.fjdpth0
{
	background: #F7F7F7;
	color: #000000;
}
.panel
{
	background: #E4E7F5 url(../../images/forms/gradient/gradient_panel.gif) repeat-x top left;
	color: #000000;
	padding: 10px;
	border: 2px outset;
}
.panelsurround
{
	background: #D5D8E5 url(../../images/forms/gradient/gradient_panelsurround.gif) repeat-x top left;
	color: #000000;
}
legend
{
	color: #22229C;
	font: 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}



select
{
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
option, optgroup
{
	font-size: 11px;
	font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}


.highlight
{
	color: #FF0000;
	font-weight: bold;
}
.fjsel
{
	background: #558AC7;
	color: #E0E0F6;
}


.thead
{
	background: #5C7099 url(../../images/forms/gradient/gradient_thead.gif) repeat-x top left;
	color: #FFFFFF;
	font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
}
.thead a:link
{
	color: #FFFFFF;
}
.thead a:visited
{
	color: #FFFFFF;
}
.thead a:hover, .thead a:active
{
	color: #FFFF00;
}
.tfoot
{
	background: #F7F7F7;
	color: #313131;
}
.tfoot a:link
{
	color: #2758A7;
}
.tfoot a:visited
{
	color: #2758A7;
}
.tfoot a:hover, .tfoot a:active
{
	color: #FC8834;
}

.button
{
	font: 9pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	cursor:hand;
	padding:3px;
}



.tborder
{
	background: #DBDBDB;
	color: #313131;
}
.tcat2
{
	background: #869BBF url(../../images/forms/gradient/gradient_tcat.gif) repeat-x top left;
	color: #313131;
	font: bold 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.tcat
{
	background: #869BBF url(../../images/forms/gradient/gradient_thead.gif) repeat-x top left;
	color: #FFFFFF;
	font: bold 11pt verdana, tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
}
.tcat a:link
{
	color: #2758A7;
	text-decoration: underline;
}
.tcat a:visited
{
	color: #2758A7;
	text-decoration: underline;
}
.tcat a:hover, .tcat a:active
{
	color: #FC8834;
	text-decoration: underline;
}
.tableGrid 
{
    
}
.tableGrid TH 
{
    background: #DBDBDB; 
    border-style:outset;
}
.tableGrid TD 
{
    background: #FFF; 
    text-align:center;
    border-style:inset;
}
INPUT , .checkbox
{
    font:normal 8pt tahoma;   
    
}

.logo 
{
    display:block;
    position:absolute;
    top:0px;
    left:38%;
}


.contactUs 
{
    padding:1em;
    border:#EEE solid 2px;
    
}

DL.storeInfoBlock DT
{
    width:120px;
    
}