/* 
Title: master styles for screen media: perforce.com
Updated: Feburary 13, 2007
*/

/* New look CSS styles. */
/* Use via import, not <link>. */
/* Pages using these styles should first link to css/p4styles.css, and then import this stylesheet. Thus styles in this stylesheet will override those in css/p4styles.css. Once the entire site is converted, css/p4styles.css can be eliminated. */
/* This CSS should validated, though 'warnings' are acceptable, as long as we understand the meaning of the warnings. */


body 
					{
					font-family: "Lucida Grande",  Verdana, Candara, sans-serif;
					font-size: x-small; /* IE5 Win */
					voice-family: "\"}\""; 
					voice-family: inherit;
					font-size: small;
					margin: 0px;
					padding: 0px;
					background: #ffffff;
					}

html>body
					{ /* be nice to Opera */
					font-size: small;
					}




/***** SELF-CLEARING FLOATS *****/

#logo:after,  #site-nav:after, #divider:after, #torso:after, #search:after, ul.quickLinks:after, hr.dashed:after, #page-top:after
					{
					content: "."; 
					display: block; 
					height: 0px; 
					clear: both; 
					visibility: hidden;
					}
* html #logo,  #site-nav, #divider, #torso, .horizontal-bar, #search, ul.quickLinks, #page-top {  height: 1%;  }		/* IE 6	*/

hr.dashed
					{
					display: block;
					border: none;
					border-bottom: dashed 1px #d1d1d1; 
					color: #ffffff;
					text-align:left;
					margin: 20px 0px 20px 0px;
					padding: 0px;
					}




/***** LOGO *****/

#logo
					{
					padding: 0px 0px 7px 0px;
					margin: 0px 0px -20px 0px;
					float: left;
					}
* html  #logo {  margin: 0px 0px -60px 0px;  }		/* IE 6	*/


/***** SEARCH BOX *****/
	
#search
					{
					padding: 0px;
					margin: 0px;
					float: right;
					width: 866px;
					}
* html  #search {  margin: 40px 0px 0px 0px;  }		/* IE 6	*/

ul.search-box
					{
					float: right;
					margin: 0px;
					padding: 0px;
					border: 0px;
					}

ul.search-box li
					{
					list-style: none;
					float: left;
					font-size: 10px;
					font-weight: bold;
					margin: 0px;
					padding: 0px;
					}

ul.search-box li.left
					{
					height: 15px;
					padding: 8px 0px 6px 42px;
					background: #ffffff url("../images/07/search/bg_left.gif") no-repeat top left;
					}
* html  ul.search-box li.left {  padding: 6px 0px 5px 42px;  }		/* IE 6	*/

ul.search-box li.middle
					{
					height: 15px;
					border-right: 1px solid #d1d1d1;
					padding: 9px 10px 5px 9px;
					background: #e9e8e3 url("../images/07/search/bg_middle.gif") no-repeat top left;
					}
* html  ul.searchBox li.middle {  padding: 3px 10px 3px 9px;  }		/* IE 6	*/

ul.search-box li.right
					{
					margin: 0px;
					color: #ffcc44;
					height: 15px;
					border-left: 1px solid #ffffff;
					padding: 10px 38px 4px 10px;
					background: #ffffff url("../images/07/search/bg_right.gif") no-repeat top right;
					}
* html  ul.search-box li.right {  padding: 10px 38px 4px 10px;  }		/* IE 6	*/

ul.search-box li.right a
					{
					color: #115577;
					}

input.search-form
					{
					width: 150px;
					font-size: 11px;
					color: #555555;
					margin: 2px 0px 0px 0px;
					border: 1px solid #d1d1d1;
					}

input.search-button
					{
					padding: 1px;
					font-size: 10px;
					color: #ffffff;
					margin: 0px;
					border: 1px solid #d1d1d1;
					background: #ababab;
					}
* html  input.search-button {  padding: 0px;  }		/* IE 6	*/

input.search-button:hover
					{
					background: #909090;
					}



/***** PAGE STRUCTURE *****/
	
#page-top
/*  This style gives each page a fixed width and is also in p4styles.css  */
					{
					width: 866px;
					margin: 0px auto;
					padding-bottom: 9px;
					padding-top: 32px;
					background: #ffffff url("../images/07/deco/toned_bar_search.gif") no-repeat bottom left;
					}
* html  #page-top {  padding-bottom: 6px;  }		/* IE 6	*/

#page-content-frame
/*  This style gives each page a fixed width and is also in p4styles.css  */
					{
					width: 866px;
					margin: 0px auto;
					padding: 8px 0px 9px 0px;
					border-top: 1px solid #deddda;
					}

#site-nav
					{
					padding: 0px;
					margin: 0pyx;
					}

/* Blue bar with site nav + bottom-bar-text info */
.horizontal-bar
					{
					padding: 0px;
					background: #e60000 url("../images/07/deco/header_bg.gif") repeat-x top left;
					margin: 0px;
					min-height: 40px;
					border-top: 1px solid #e60000;
					border-bottom: 1px solid #e60000;
					} 

/* Container with tan background containing nav + contnent */
#torso
					{
					padding: 0px;
					margin: 0px;
					clear: both; 
					background: #e9e8e3 url("../images/07/deco/nav_background_edge.gif") repeat-y top left;
					}
* html  #torso {  height: 1%;  }		/* IE 6	*/
					
/* tan div with all the content: main + side */
.content
					{
					float: left;
					padding: 8px 0px 8px 20px;
					width: 670px;
					background: #ffffff;
					min-height: 440px;
					border-bottom: 1px solid #deddda;
					}
/* forces .content in IE to have a min-height; but it expands if content dictates (height declaration will not expand in FF) */
* html  .content		{		height: 440px;		}		/* IE 6	*/

.toned-bar-top
					{
					width: 866px;
					background: #e9e8e3 url("../images/07/deco/toned_bar_top.gif") no-repeat bottom left;
					height: 9px;
					border-top: 1px solid #deddda;
					margin: 8px 0px 0px 0px;
					padding: 0px;
					}
					

/* used along with "<!-- -->" in the div, this IE hack lets you control it's height */
* html  .toned-bar {  font-size: 1px; line-height: 0; height: 8px; }		/* IE 6	*/

.toned-bar-bottom
					{
					width: 866px;
					background: #e9e8e3 url("../images/07/deco/toned_bar_bottom.gif") no-repeat top right;
					height: 20px;
					border-bottom: 1px solid #deddda;
					margin: 0px 0px 8px 0px;
					padding: 0px;
					}
/* used along with "<!-- -->" in the div, this IE hack lets you control it's height */
* html  .toned-bar {  font-size: 1px; line-height: 0; height: 9px; }		/* IE 6	*/

/* Two column layouts */
/* Use "main" for left column; "side" for right */
div.main
					{
					float: left;
					width: 420px;
					text-align: left;
					vertical-align: top;
					margin-right: 20px;
					padding-right: 20px;
					border-right: 1px solid #d1d1d1;
					overflow: hidden;
					margin-bottom: 10px;
					}
    /* "overflow: hidden" is an IE hack. */
    /* Benefit: if content is too wide for the leftmost column;  the rightmost column won't be pushed downward. */
    /* Problems created: the too-wide content is clipped on the right. There are other solutions, all with their own issues. */
    /* This is discussed here: http://www.positioniseverything.net/explorer/expandingboxbug.html */

div.side
					{
					width: 209px;
					float: right;
					text-align: left; 
					vertical-align: top;
					overflow: hidden;
					font-size: 85%;
					margin-bottom: 10px;
					}
*+html div.side {	font-size: 80%; }		/* IE 7	*/
/* See discussion of "overflow: hidden" above. */
/* Apparently the overflow can work both ways, so it needs to be here as well. */

/* Use these two subclasses when the main column is shorter then the side column */
/* Usages:  <div class="main main-short"> <div class="side side-long">  */
div.main-short
					{
					padding-right: 0px;
					border-right: 0px;
					}

div.side-long
					{
					padding-left: 20px;
					border-left: 1px solid #d1d1d1;
					}




/***** SITE-WIDE NAV *****/

.horizontal-nav-links
					{
					float: right;
					padding: 0px;
					margin: 0px;
					}

.horizontal-nav-links li
					{
					list-style: none;
					float: left;
					padding: 0px;
					font-size: 10px;
					margin: 0px;
					border-left: 1px solid #000000;
					}
*+html .horizontal-nav-links li {			font-size: .75em;		}		/* IE 7	*/

.horizontal-nav-links li.bottom-bar-text
 					{
					padding: 13px 15px 10px 15px;
					color: #e60000;
					font-weight: bold;
					}
* html  .horizontal-nav-links li.bottom-bar-text	{  padding: 11px 15px 10px 15px;  }		/* IE 6		*/
*+html .horizontal-nav-links li.bottom-bar-text {		padding: 12px 15px 11px 15px;		}		/* IE 7	*/

.horizontal-nav-links a, .horizontal-nav-links a:visited
					{
					padding: 13px 15px 10px 15px;
					color: #FFFFFF;
					font-weight: bold;
					display: block;
					}
* html  .horizontal-nav-links a	{  padding: 10px 15px 10px 15px;  }		/* IE 6		*/
* html  .horizontal-nav-links a:visited		{  padding: 10px 15px 10px 15px;  }		/* IE 6		*/
*+html .horizontal-nav-links a {		padding: 10px 15px 10px 15px; 		}		/* IE 7	*/
*+html .horizontal-nav-links a:visited {		padding: 10px 15px 10px 15px; 		}		/* IE 7	*/

.horizontal-nav-links a:hover
					{
					background: #ff0000 url("../images/07/deco/header_bg_hover.gif") repeat-x top left;
					text-decoration: none;
					}





/***** MAIN NAVBAR *****/

#navbar-side
					{
					float: left;
					width: 176px;
					background: #e9e8e3;
					font-family: "Lucida Grande",  Verdana, Candara, sans-serif;
					font-size: 10px;
					}

ul.navbar
					{
					margin: -2px 0px 0px 0px;
					padding: 0px 0px 1px 0px;
					list-style: none;
					background: #ffffff  url("../images/07/deco/nav_background.gif") no-repeat bottom right;
					font-size: 12px;
					}

.navbar li
					{
					display: block;
					padding: 0px;
					margin: 0px;
					background: url("../images/07/deco/nav_cap.gif") no-repeat center;
					background-position: middle;
					}

.navbar li.nav1 a, .navbar li.nav1 a.visited, .navbar li.nav1 a.active
					{
					display: block;
					padding: 3px 0px 3px 8px;
					margin-top: 2px;
					color: #115577;
					background: url("../images/07/deco/nav_cap.gif") no-repeat center right;
					width: 168px;
					color: #c9851a;
					text-decoration: none;
					font-weight: bold;
					font-size: .9em;
					}
* html .navbar li.nav1 a		{	font-size: .9em; }		/* IE 6	*/
*+html .navbar li.nav1 a		{	font-size: .9em; }		/* IE 7	*/

.navbar li.nav1 a:hover
					{
					color: #115577;
					text-decoration: none;
					background-image: none;
					}

.navbar li.nav1 a.active, .navbar li.nav1 a.active:hover
					{
					color: #115577;
					text-decoration: none;
					background: url("../images/07/deco/nav_cap.gif") no-repeat center;
					background-position: middle;				
					}

.navbar li.nav2 a, .navbar li.nav2 a.visited,  .navbar li.nav2 a.active
					{
					display: block;
					padding: 0px 22px 7px 16px;
					margin: 0px;
					background: url("../images/07/deco/nav_cap.gif") no-repeat center right;
					width: 138px;
					color: #598195;
					text-decoration: none;
					line-height: 1.2em;
					font-weight: normal;
					font-size: 10px;
					}

.navbar li.nav2 a:hover
					{
					color: #115577;
					text-decoration: none;
					background-image: none;
					}

.navbar li.nav2 a.active, .navbar li.nav2 a.active:hover
					{
					color: #115577;
					text-decoration: none;
					background: url("../images/07/deco/nav_cap.gif") no-repeat center;
					background-position: middle;				
					}





/***** STYLES USED IN SIDE COLUMN *****/

.side p, .side li, .side a, .side dt, .side dd
					{
					margin: 0px 0px 8px 0px;
					line-height: 1.3em;
					}
*+html .side p 		{	font-size: 100%; }		/* IE 7	*/
*+html .side li		{	font-size: 100%; }		/* IE 7	*/
*+html .side a		{	font-size: 100%; }		/* IE 7	*/
*+html .side dt		{	font-size: 100%; }		/* IE 7	*/
*+html .side dd	{	font-size: 100%; }		/* IE 7	*/

.side dl
					{
					margin: 0px;
					}

.side dt
					{
					font-weight: bold;
					margin: 0px;
					}

.side ul
					{
					padding: 0px 5px 0px 15px;
					margin: 0px 0px 0px 5px;
					list-style-image: url(../images/07/pDot.gif);
					border-bottom: 0px solid #eebb44;
					border-right: 0px solid #eebb44;
					border-top: 0px solid #e0e0e0;					
					}
* html .side ul {  margin: 0px 0px 0px 1px; }		/* IE 6	*/

.side img
					{
					margin-bottom: 5px;
					}

.side h1
/*	Creates the gold box with the blue text */
/* Font size still in pixels */
					{
					font-size: 11px;
					font-weight: bold;
					line-height: 14px;
					color: #224466;
					background: #ffcc44 url("../images/07/deco/highlight_hl.gif") repeat-x top left;
					padding: 3px 10px 3px 4px;
					margin: 0px;
					letter-spacing: 0px;
					}

.highlightTitleBar
/* Creates the white and gold frame around the gold box */
					{
					background: #ffffff;
					margin: 0px;
					padding: 1px;
					border: 1px solid #ffcc44;
					}

.highlightFrame
/* Creates the gold frame around the text under the gold box */
/*  VERY IMPORTANT: SEE NOTE JUST BELOW BEFORE USING!!!!      */
					{
					padding: 5px 10px 1px 0px;
/*					border: 1px solid #ffcc44;					*/
					border-top: 1px solid #f7f7f7;
					border-left: 0px;
					margin-bottom: 10px;
					background:  url("../images/07/deco/hightlight_curve.gif") no-repeat bottom right;
					}
  /* Unfortunately the use of ".highlightFrame" sometimes causes a  ghost border to extend all the way across both columns. */
  /* The fix is to add an HTML comment just before the close </div> of  the LAST .highlightFrame. */
  /* See perforce/gamedev/index.html for an example. (If it doesn't work by putting it in the LAST one, put it in a bunch of them. We found this fix on the web, and it works! */




/***** TYPE ELEMENTS *****/
	
h1, h2, h3, h4
					{
					font-weight: bold;
					}

h1
/* Font size still in pixels */
					{
					font-size: 24px;
					margin-top: 10px;
					margin-bottom: 14px;
					font-weight: bold;
					letter-spacing: -1px;
					}
*+html h1 {	font-size: 180%;	}		/* IE 7	*/

h2
/* Font size still in pixels */
					{
					color: #115577;
					font-size: 18px;
					margin-top: -10px;
					margin-bottom: 20px;
					letter-spacing: -1px;
					}
*+html  h2 {	font-size: 135%;	}		/* IE 7	*/

h3
/* Font size still in pixels */
					{
					color: #326ea1;
					font-size: 14px;
					margin-top: 10px;
					margin-bottom: 10px;
					}
*+html  h3 {	font-size: 110%;		}		/* IE 7	*/

h4
					{
					font-size: 98%;
					margin-top: 20px;
					margin-bottom: 4px;
					}

p, li, ul, ol
					{
					font-size: 98%;
					line-height: 1.5em;
					margin-top: 0px;
					margin-bottom: 8px;
					}
*+html  p {	font-size: 100%;	}		/* IE 7	*/
*+html  li {	font-size: 100%;	}		/* IE 7	*/
*+html  ul {	font-size: 100%;	}		/* IE 7	*/
*+html  ol {	font-size: 100%;	}		/* IE 7	*/

ul, ol
					{
					margin: 0px;
					margin-top: 4px;
					margin-bottom: 10px;
					}

ul
 					 {
					padding-left: 25px;
					}

ol
 					 {
					padding-left: 27px;
					}

ol li, ul li
					{
					margin-top: 4px;
					margin-bottom: 4px;
					}




/***** ANCHOR TAG STYLES *****/

a, a:visited
					{
					font-weight: bold;
					text-decoration: none;
					color: #c9851a;
					}

a:hover
					{
					text-decoration: underline;
					}




/***** HORIZONTALONTAL RULES *****/

/* Used in place of "<hr>" */
/* Usage: <div class="hr-dotted"></div> */

.hr-dotted
					{
					margin-bottom: 20px;
					padding-bottom: 12px;
					border-bottom: 1px dotted #d1d1d1;
					}

.hr-dotted-top
					{
					margin: 0px 0px 20px 0px;
					padding: 0px;
					border-bottom: 1px dotted #d1d1d1;
					}

div.locations .hr-dotted
					{
					margin: 0px;
					padding: 0px;
					border-bottom: 1px dotted #d1d1d1;
					clear: both;
					}

.hr-solid
					{
					margin-bottom: 20px;
					padding-bottom: 12px;
					border-bottom: 1px solid #d1d1d1;
					}




/***** DATA TABLE STYLES  ****/
 /* See "training.htm" for usage. */

table.data
					{
					width: 100%;
					margin-bottom: 20px;
					background: #ffffff;
					font-size: 85%;
					line-height: 1.2em;
					}
*+html table.data {	font-size: 80%; }		/* IE 7	*/

*+html table.data a {	font-size: 105%;	}		/* IE 7	*/

table.data td, table.data th
					{
					padding: 5px 10px;
					text-align: left;
					vertical-align: top;
					border: 0px;
					border-bottom: 1px solid #d1d1d1;
					}

table.data th
					{
					font-weight: bold;
					} 
 
 table.data h1
					{
					font-size: small;
					letter-spacing: 0px;
					}

table.data h2
					{
					color: #000;
					letter-spacing: 0px;
					}

*+html table.data p {	font-size: 100%;	}		/* IE 7	*/

table.data dt
					{
					margin-bottom: 0px;
					font-weight: bold;
					}




/***** AWARDS TABLE STYLES * SUBCLASS OF DATA ****/

table.awards
					{
					border-top: 1px dotted #d1d1d1;
					}

table.awards th, table.awards td
					{
					border-bottom: 1px dotted #d1d1d1;
					padding: 10px;
					vertical-align: middle;
					}




/***** DOCUMENTS TABLE STYLES * SUBCLASS OF DATA ****/

table.documents th.title
					{
					width: 220px;
					}

table.documents th.options
					{
					width: 50px;
					}




/***** PRESS RELEASE/COVERAGE TABLE STYLES * SUBCLASS OF DATA ****/

table.prRel th.date
					{
					width: 50px;
					}

table.prRel th.description
					{
					width: 600px;
					}




/***** COMPONENTS TABLE STYLES * SUBCLASS OF DATA ******/
/* Used only on "products.css" */

table.components
					{
					width: 100%;
					border-top: 1px solid #d1d1d1;
					}

table.components h4
					{
					margin: 0px;
					}

table.components td
					{
					padding: 6px 10px 0px 10px;
					width: 320px;
					border-left: 1px solid #d1d1d1;
					}

table.components td.right
					{
					padding: 6px 10px 0px 10px;
					width: 320px;
					border-right: 1px solid #d1d1d1;
					}



/***** SYSTEM TERMINOLOGY TABLE STYLES * SUBCLASS OF DATA *****/
/* used on perforce/reviews.html */

table.terms th.perforce, table.terms td.perforce
					{
					width: 110px;
					font-weight: bold;
					}

table.terms th.others, table.terms td.others
					{
					width: 205px;
					}

table.terms th.remarks, table.terms td.remarks
					{
					width: 335px;
					}




/***** 3RD PARTY PLUG-INS TABLE STYLES * SUBCLASS OF DATA *****/
/* used on all 3rd-party ide plug-in pages */

table.ide th.company, table.ide td.company
					{
					width: 125px;
					font-weight: bold;
					}

table.ide th.tool, table.ide td.tool
					{
					width: 400px;
					}

table.ide th.plugin, table.ide td.plugin
					{
					width: 125px;
					}




/***** RELEASE NOTE STYLES * SUBCLASS OF DATA *****/

table.relnotes
					{
					width: 320px; 
					float: left; 
					}

table.rl-left
					{
					margin-right: 10px;
					}

table.rl-clear
					{
					margin-right: 10px; 
					clear: both;
					}




/***** DOWNLOADS TABLE STYLES * SUBCLASS OF DATA *****/

table.downloads
					{
					margin-bottom: 20px;
					width: 100%;
					}
					
table.downloads td, table.downloads th
					{
					margin: 0px;
					padding: 17px;
					padding-bottom: 15px;
					text-align: left;
					vertical-align: middle;
					border: 0px;
					border-bottom: 1px solid #d1d1d1;
					}

table.downloads th.download
					{
					width: 50px;
					}

table.downloads th.version
					{
					width: 50px;
					}

table.downloads td.release
					{
					width: 180px;
					border-left: 1px solid #d1d1d1;
					padding-top: 0px;
					vertical-align: top;
					}

table.downloads td.release p, table.downloads td.release li
					{
					color: #878787;
					}

table.downloads td.release h1
					{
					font-size: 100%;
					margin-top: 17px;
					margin-bottom: 4px;
					color: #676767;
					letter-spacing: 0px;
					}




/***** DOWNLOAD PLATFORMS * SUBCLASS OF DATA *****/
/* From loadprog.html */
 /* Usage: <table class="data platforms" cellspacing="0">  */

table.platforms td, table.platforms th
					{
					width: 50%;
					}

/* HEADERS for download platforms */
/* Subclass of our standard headers */
/* Usage: <h3 class="platforms">  */

h3.platforms
					{
					margin-left: 4px;
					margin-bottom: 3px;
					margin-top: 3px;
					}




/***** CUSTOMER PAGE TABLES * SUBCLASS OF DATA *****/

/* Displays zebra'd list of customers alphabetically, or by region, or by industry. */
/* Example: perforce/customers/byname.html */
/* Usage:   <table class="data customer"> */

table.customer
					{
					;
					}

 table.customer td
					{
					width: 50%;
					}

 table.customer th
					{
					font-weight: bold;
					background: #d1d1d1;
					}

 table.customer th.col2
					{
					text-align: right;
					padding-right: 10px;
					}

 table.customer td.col2
					{
					border-left: 1px solid #d1d1d1;    
					}




/***** PRICING INFO * SUBCLASS OF DATA *****/
/* used on price.html  */

   table.price td.license, table.price th.license
   					{
  					width: 200px;
   					}

   table.price td.price, table.price th.price
   					{
   					width: 145px;
   					}

   table.price th.examples, table.price th.examples
   					{
   					width: 250px;
   					}



/***** TABLE WITH A TITLE AND DESCRIPTION COLUMN * SUBCLASS OF DATA *****/
/* used on technical.html for example */

table td.title, table th.title
/* gives a fixed width to title column */
					{
					width: 170px;
					}

table.data td.description
/* this adds a left border to a cell in a data table */
					{
					border-left: 1px solid #d1d1d1;
					color: #232323;
					}

table.data td.no-border
/* remove a bottom border gratuitously from a data table */
					{
					border-bottom: 0px;
					}




/***** LATEST FEATURES TABLE *****/

table.latest h1
/* Product Names as in latest.html Umm... why is this being used? */
					{
					font-size: 110%;
					font-weight: bold;
					margin-top: 2px;
					margin-bottom: 0px;
					letter-spacing: 0px;
					}
					
					
					

/***** DOCUMENTATION TABLE *****/

table.documents tr:hover
/* gives a rollover colort to rows in a docs table */
					{
/*					background: #ecf3fc;					*/
					}			

table.documents tr:hover>th
/* 'removes' hover effect from a th */
					{
/*						background: #ffffff;					*/
					}		




/***** SUPPORT PAGE LOCATIONS TABLE *****/

div.support-locs .hr-dotted
					{
					margin: 0px;
					padding: 0px;
					border-bottom: 1px dotted #d1d1d1;
					clear: both;
					}

div.support-locs h2
					{
					margin-top: 0px;
					margin-bottom: 0px;
					color: #000000;
					letter-spacing: 0px;
					}




/***** FANCY DATA TABLE STYLES *****/

table.fancy
					{
					width: 100%;
					margin-bottom: 20px;
					background: #ffffff;
					font-size: 90%;
					line-height: 1.5em;
					}

table.fancy td, table.fancy th
/* .chart td can go once all tables are converted */
					{
					margin: 0px;
					padding: 10px 10px 0 10px;
					text-align: left;
					vertical-align: top;
					border: 0px;
					border-bottom: 1px solid #d1d1d1;
					}

table.fancy td.title 
					{
					vertical-align: top; 
					border-right: 1px solid #d1d1d1;
					border-bottom: 0px solid #d1d1d1; 
					padding: 10px 10px 0 10px;
					background: #ffffff;
					width: 170px;
					}

table.fancy td.title p
/* Font size still in pixels */
					{
					font-size: 16px;
					font-weight: bold;
					color: #115577; 
					margin: 0px; 
					margin-bottom: 10px;
					line-height: 16px;
					}

table.fancy td.pcp, table.fancy th.pcp
/* PCP class - a subclass of fancytable, to set column width */
/* See pcplist.html for usage. */
					{
					width: 190px;
					}




/***** FANCY DL STYLES *****/

dl.fancy
					{
					width: 650px;
					margin-bottom: 20px;
					clear: both;
					}

dd.tableText table.fancy
					{
					width: 461px;
					}

dd.tableText
					{
					float: right;
					margin-left: -1px;
					vertical-align: top;
					}
					
dl.fancy dt.title
/* Font size still in pixels */
					{
					vertical-align: top;
					font-size: 16px;
					font-weight: bold;
					color: #ff8800; 
					margin: 0px;
					line-height: 16px;
					padding: 10px;
					width: 170px;
					border-top: 1px solid #d1d1d1;
					margin-top: 23px;
					float: left;
					}

dl.fancy dd, dl.fancy dd.zebra, dl.fancy dd.top
					{
					margin: 0px;
					padding: 5px 5px 0px 5px;
					text-align: left;
					vertical-align: top;
					border-left: 1px solid #d1d1d1;
					border-bottom: 1px solid #d1d1d1;
					width: 449px;
					float: right;
					}

dl.fancy dd.top
					{
					margin-top: 23px;
					border-top: 1px solid #d1d1d1;
					}

dl.fancy dd p, dl.fancy dd.top p, dl.fancy dd.zebra p, dl.fancy li, dl.fancy a
					{
					font-size: 90%;
					line-height: 16px;
					}

dl.fancy dd.zebra, dl.fancy dd.top
					{
					background: #efefef;
					}

dl.fancy li 
					{
					margin-bottom: 0px;					
					padding-bottom: 0px;
					}

dl.fancy img
					{
					margin-top: 10px;
					}




/***** EVAL DEMO STYLES *****/
/* Only used on evaldemo.html */

.demoFrame
					{
					width: 670px;
					border: 1px solid #d1d1d1;
					border-top: 0px;
					border-bottom: 0px;
					background: #f7f7f7;
					padding: 0px;
					margin: 0px;
					}

div.demoTop
					{
					background: url("../images/evalDemo/eval_top.gif") no-repeat top left;
					height: 3px;
					padding: 0px;
					margin: 0px;
					}
* html div.demoTop {  margin-bottom: -12px; }		/* IE 6	*/

div.demoBottom
					{
					background: url("../images/evalDemo/eval_bottom.gif") no-repeat bottom left;
					height: 3px;
					padding: 0px;
					margin: 0px;
					}
* html div.demoBottom {  margin-top: 0px; background: url("../images/evalDemo/eval_bottom.gif") no-repeat top left; }		/* IE 6	*/

.demoFrame .title
					{
					width: 332px;
					background: #ffffff;
					border: 1px solid #d1d1d1;
					padding: 20px;
					}

.demoFrame .gutter
					{
					width: 1px;
					}

.demoFrame .action
					{
					width: 332px;
					border: 1px solid #d1d1d1;
					border-top: 0px;
					border-bottom: 0px;
					padding: 20px;
					background: #f7f7f7;
					vertical-align: top;
					}
 
.demoFrame .show, .demoFrame .give
					{
					width: 332px;
					border: 1px solid #d1d1d1;
					padding: 20px;
					padding-bottom: 10px;
					background: #ffffff;
					}

.demoFrame h3
					{
					margin: 0px;
					padding: 0px;
					}

.demoFrame h4
					{
					margin-top: 0px;
					color: #115577;
					}

.demoFrame img.evalDownload
					{
					display: block;
					margin-left: auto;
					margin-right: auto;
					margin-top: 20px;
					padding: 0px
					}

.demoFrame p.zero
					{
					margin-bottom: 0px;
					padding-bottom: 0px;
					}




/***** STYLES THAT CHANGE APPEARANCES FOR VERY SPECIFIC PURPOSES *****/

p.br
					{
					padding: 0px;
					margin: 0px;
					}

h3.top
					{
					margin-top: 0px;
					}

p.caption
					{
					font-size: 90%;
					color: #898989;
					}

p.footnote, sup.footnote-num
					{
					font-size: 90%;
					font-style: italic;
					color: #898989;
					}

sup.footnote-num
					{
					vertical-align: super;
					}

strong.starburst
/* Use this for NEW! or COOL! or RELEASE 2006.3! */
					{
					color: #a00d18;
					}

tr.zebra, td.zebra
/* Zebra striping for any table */
/* Usage: '<tr class="zebra">' alternates with "<tr>" */
/* Also table declaration *must* contain 'cellspacing="0" */
					{
					background: #f5f5f5;
					}

table.cen td, table.cen th
/* Vertical centering of text */
/* Usage: '<table class="(base-class) cen">' */
/* Examples: products/defecttracking_table.html */
					{
					vertical-align: middle;
					}




/***** FORMATS FOR MANAGEMENT PAGE *****/

table.mngt
					{
					width: 100%;
					}

table.mngt td.left
					{
					padding: 10px;
					border-bottom: 1px dotted #d1d1d1;
					border-right: 1px dotted #d1d1d1;
					}

table.mngt td.right
					{
					padding: 10px;
					border-bottom: 1px dotted #d1d1d1;
					}

table.mngt td.bottom_left
					{
					padding: 10px;
					border-right: 1px dotted #d1d1d1;
					}

table.mngt td.bottom_right
					{
					padding: 10px;
					}

table.mngt img
					{
					float: left;
					margin-right: 10px;
					}




/***** IMAGE FORMATS, MOSTLY BORDERS, MARGINS, & PADDING *****/

img
					{
					border: 0px;
					padding: 0px;
					margin: 0px;
					}
	
img.rss
					{
					vertical-align: middle;
					padding: 0px;
					margin: 0px 5px 0px 0px;
					}

img.center 
					{
					display: block;
					margin-left: auto;
					margin-right: auto;	
					}

img.products 
					{
					margin-bottom: 5px;
					}

img.border, img.border-main
					{
					padding: 3px;
					border: 1px solid #d1d1d1;
					}

img.left
					{
					float: left;
					margin-right: 12px;
					margin-top: 8px;
					}

img.right
					{
					float: right;
					margin-left: 12px;
					margin-top: 8px;
					}



/*****RANDOM THINGS *****/

/***** GENERIC QUICKLINKS STYLES *****/

/* Must subclass for *all* actual uses of quicklinks */
/* See "Quicklinks Subclass" section below */

/* Did you just change QuickLink content in an HTML file and were directed here to change QuickLink widths? */
/* See note with subclasses, a little below. */

.quickLinks
					{
					display: block;
					width: 100%;
					margin: 30px 0px 20px 0px;
					padding: 0px;
					text-align: center;
					border-bottom: 1px solid #d1d1d1;
					}

.quickLinks ul
					{
					display: table;
					margin: 0px auto;
					padding-left: 0px;
					text-align: center;
					list-style: none;
					font-size: 11px;
					}

.quickLinks li
					{
					float: left;
					margin: 0px 1px 0px 1px;
					padding: 0px;
					text-align: center;
					}
* html .quickLinks li {  display: inline; float: none; margin: 0px; }		/* IE 6	*/

.quickLinks a
/* Font size still in pixels */
					{
					display: block;
					margin: 0px;
					padding: 3px 6px 4px 6px;
					background: #efefef url("../images/07/deco/quicklinks_hi.gif") repeat-x top left;
					text-align: center;
					font-size:  11px;
					line-height: 14px;
					border-left: 1px solid #d1d1d1;
					border-top: 1px solid #d1d1d1;
					border-right: 1px solid #d1d1d1;
					}
* html .quickLinks a {  display: inline-block; float: none; padding: 3px 6px 5px 6px; }		/* IE 6	*/

.quickLinks a:hover
					{
					background: #e5e5e5 url("../images/07/deco/quicklinks_hi_hover.gif") repeat-x top left;
					text-decoration: none;
					}




/***** SLIDESHOW ICON *****/
/* see component pages */

dl.slideshow
					{
					margin-bottom: 10px;
					clear: both;
					}

dl.slideshow dt
					{
					float: left;
					padding: 0px
					}

dl.slideshow dd
					{
					margin-left: 40px;
					}
/* keeps text left margin from getting ragged */
* html dl.slideshow dd	{	height: 1%;	}	/* IE 6	*/

dl.slideshow dd h1
					{
					color: #000000;
					font-weight: bold;
					padding: 0px;
					margin: 0px;
					background: #ffffff;
					letter-spacing: 0px;
					}




/***** VIDEO ICON *****/
/* see p4v component page */

div.videoBorder
					{
					padding-top: 10px;
					border-top: 1px dotted #d1d1d1;
					margin-top: 10px;
					margin-bottom: 10px;
					}

dl.video dt
					{
					float: left;
					padding: 0px
					}

dl.video dd
					{
					margin-left: 40px;
					}
/* keeps text left margin from getting ragged */
* html dl.video dd		{	height: 1%;	}	/* IE 6	*/

dl.video dd h1
					{
					color: #000000;
					font-weight: bold;
					padding: 0px;
					margin: 0px;
					background: #ffffff;
					letter-spacing: 0px;
					}

dl.video dd p
					{
					color: #c1c1c1;
					padding: 0px;
					margin: 0px;
					}

.test-drive-video
					{
					border-top: 1px solid #d1d1d1;
					border-bottom: 1px dotted #d1d1d1;
					margin: 20px 0px 20px 0px;
					padding: 1px 0px 0px 0px;
					text-align: center;
					font-size: 90%;
					}
* html .test-drive-video {  font-size: 80%;  }		/* IE 6	*/

.test-drive-video:after
					{
					content: "."; 
					display: block; 
					height: 0; 
					clear: both; 
					visibility: hidden;
					}
* html .test-drive-video {  height: 1%;  }		/* IE 6	*/

.test-drive-video p
					{
					padding: 0px;
					margin: 0px;
					}

.test-drive-video p.title
					{
					display: block;
					padding: 3px 5px;
					background: #ffcc44;
					font-weight: bold;
					text-align: center;
					color: #000000;
					margin-bottom: 1px;
					}
* html .test-drive-video p.title {  padding: 0px 0px 2px 5px;  }		/* IE 6	*/

.test-drive-video ul
					{
					display: table;
					margin: 0px auto;
					padding: 0px;
					width: 100%;
					}

.test-drive-video li
					{
					float: left;
					padding: 6px 20px 2px 20px;
					margin: 0px;
					display: block;
					text-align: center;
					color: #898989;
					width: 27%;
					}

.test-drive-video li:hover
					{
					background: #f1f7fa;
					}

.test-drive-video img
					{
					padding: 2px;
					border: 1px solid #d1d1d1;
					background: #ffffff;
					}

.test-drive-video li.tlv, .test-drive-video li.rg
					{
					border-right: 1px dotted #d1d1d1;
					}