/*! $Id: apf.source.css,v 1.4 2011/01/26 02:21:47 santelia Exp $ */
/**
 * File:    		Advanced Product Finder (APF)
 * Version:			1.1
 * Version date:	Jan 25, 2010
 * Author:			Michael Santelia
 * Modifications need to be made to source file, NOT *this* file. Read the documentation.
 * Versions: 
 *  1.1 - Updated home slide to make buttons and boxes full width.
 */
 
/******** Outer APF container properties. ********/
div#apfTool {
	height: 322px;
	overflow: hidden;
	background: url(//www.ibm.com/software/info/js/apf/apfbg.jpg) top left no-repeat;
	border: 1px solid #ccc;
}
div#apfTool.noborder {
	border: none;
}

/******** Set the width and positioning of everything once, so we can easily change if needed. ********/
div#apfTool, 
div#apfSlides,
div#apfSlides div.apfSlide,
div#apfSlides div.apfSlide div.apfSlideHead,
div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideVertUp, 
div#apfSlides div.apfSlide div.apfSlideBodyCon, 
div#apfSlides div.apfSlide div.apfSlideBodyCon div.apfSlideBody, 
div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideVertDown { position: relative; } 

div#apfTool, 
div#apfSlides div.apfSlide,
div#apfSlides div.apfSlide div.apfSlideHead,
div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideVertUp, 
div#apfSlides div.apfSlide div.apfSlideBodyCon, 
div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideVertDown,
div#apfSlides div.apfSlide div.apfSlideFooter { width: 528px; } 


/******** Individual element styles. ********/
/******** Slides container. ********/
div#apfSlides {
	padding-left: 5px;
	width: 11000px;
}

/******** Each slide. ********/
div#apfSlides div.apfSlide {
	float: left;
	height: 320px; 
	overflow: hidden; 
}

/** Format each slide's header title and descr. **/
div#apfSlides div.apfSlide div.apfSlideHead p.apfSlideTitle {
	color: #777!important;
	font-size: 20px!important;
	font-weight: normal!important;
	margin: 3px 0px -6px 0px!important;
}

div#apfSlides div.apfSlide div.apfSlideHead p span.apfSlideTitleSW {
	color: #000!important;
	font-weight: bold!important;
}

div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideHeadDesc {
	padding-left: 2px!important;
}

div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideHeadDesc p {
	font-size: .75em!important;
}

/** Overlay spacing fix for slide title and descr. **/
div#apfOverlayCon div#apfSlides div.apfSlide div.apfSlideHead p.apfSlideTitle {
	margin-left: -4px!important;
}

div#apfOverlayCon div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideHeadDesc p {
	margin-left: 0px!important;
	padding-left: 5px!important;
}

/** Viewport for each slide content. **/
div#apfSlides div.apfSlide div.apfSlideBodyCon {
	height: 220px;
	overflow: hidden;
}

/** Style the list items for each slide. **/
div#apfSlides div.apfSlide div.apfSlideBody ul {
	list-style: none;	
	margin: 0;
	padding: 0 0 5px 0;
}

div#apfSlides div.apfSlide div.apfSlideBody ul li {
	font-size: 11px;
	padding-left: 5px;
	text-indent: 10px;
}
* html div#apfSlides div.apfSlide div.apfSlideBody ul li {
	padding-left: 7px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul li a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg.png) no-repeat left top;
	color: #000;
	display: block;
	height: 20px;
	line-height: 20px;
	text-decoration: none;
	width: 510px;
}

/** IE6 version of list items. **/
* html div#apfSlides div.apfSlide div.apfSlideBody ul li a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg-ie6.png) no-repeat left top;
	height: 18px;
	line-height: 18px;
	width: 506px;
}

/** Custom BGs for each LI - Based on if there's subitems and/or a "info" link. **/
div#apfSlides div.apfSlide div.apfSlideBody ul li.apfLiItems a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg-arrow.png) no-repeat left top;
}
div#apfSlides div.apfSlide div.apfSlideBody ul li.apfLiItemsLink a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg-arrow-bar.png) no-repeat left top;
}

/** IE versions **/
* html div#apfSlides div.apfSlide div.apfSlideBody ul li.apfLiItems a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg-ie6-arrow.png) no-repeat left top;
}
* html div#apfSlides div.apfSlide div.apfSlideBody ul li.apfLiItemsLink a {
	background: url(//www.ibm.com/software/info/js/apf/listitembg-ie6-arrow-bar.png) no-repeat left top;
}

/** Custom BGs for each LI if we are making it a a twistie LI. **/
div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwClosed span.apfTwPh
, div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwOpen span.apfTwPh {
	background: url(//www.ibm.com/software/info/js/apf/twistie-closed.gif) no-repeat left 3px;
	display: block;
	margin: 2px 0px 0px 12px;
	position: absolute;
	width: 10px;
}
div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwOpen span.apfTwPh {
	background: url(//www.ibm.com/software/info/js/apf/twistie-open.gif) no-repeat left top;
	margin: 8px 0px 0px 10px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwClosed a
, div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwOpen a {
	padding-left: 13px;
}

/** IE versions of twisty. **/
* html div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwClosed span.apfTwPh{
	background-position: left 3px;
	margin: 3px 0px 0px 10px;
}
* html div#apfSlides div.apfSlide div.apfSlideBody ul li.apfTwOpen span.apfTwPh {
	margin: 9px 0px 0px 8px;
}

/** Each slide's LI info link icon. **/
div#apfSlides div.apfSlide div.apfSlideBody ul li span.apfILI {
	display: inline;
	height: 18px;
	position: absolute;
	right: 52px;
	text-indent: 0px;
	width: 15px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul li.apfLiNoItems span.apfILI {
	right: 25px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul li span.apfILI a {
	background: url(//www.ibm.com/software/info/js/apf/infoicon.png) no-repeat left center;	
	position: absolute;
	text-indent: 0px;
	top: 1px;
	width: 15px;
}

/** IE version of LI info link icon. **/
* html div#apfSlides div.apfSlide div.apfSlideBody ul li span.apfILI a {
	background: url(//www.ibm.com/software/info/js/apf/infoicon-ie6.gif) no-repeat left center;
	top: 2px;
}

/** Each slide's product list bulleted list. **/
div#apfSlides div.apfSlide div.apfSlideBody ul.apfProdList {
	list-style-type: none;
	padding-top: 4px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul.apfProdList li {
	background: transparent url(//www.ibm.com/i/v16/bullets/sprites.gif) no-repeat 6px -806px;
	font-size: 11px;
	margin-left: 15px;
	padding-bottom: 0px;
	padding-top: 0px;
	text-indent: 10px;
}

/** IE6 version of product listing LI **/
* html div#apfSlides div.apfSlide div.apfSlideBody ul.apfProdList li {
	margin-top: -3px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul.apfProdList li a {
	background: none;
	color: #4C6E94;
	height: 15px;
	line-height: 15px;
	text-indent: 10px;
}

div#apfSlides div.apfSlide div.apfSlideBody ul.apfProdList li a:hover {
	text-decoration: underline;
}


/** On hover of any li a link, show blue text. **/
div#apfSlides div.apfSlide div.apfSlideBody ul li a:hover { color: #4C6E94; }


/******** Each slide's scroll up/down controls. ********/

/** Slide's scroll up control. **/
div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideVertUp {
	/**text-align: center;**/
	background: url(//www.ibm.com/software/info/js/apf/scrollup.png) no-repeat 50% 0;
	height: 18px;
	margin-bottom: 1px;
	text-indent: -1000px;
}

/** Slide's scroll down control - anchor to bottom above .footer (footer H + this height = bottom). ********/
div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideVertDown {
	background: url(//www.ibm.com/software/info/js/apf/scrolldown.png) no-repeat 50% 0;
	height: 18px;
	margin-top: 1px;
	text-align: center;
	text-indent: -1000px;
}

div#apfSlides div.apfSlide div.apfSlideFooter.noVertScroll div.apfSlideVertDown {
	background: none;
}

div#apfSlides div.apfSlide div.apfSlideHead.noVertScroll div.apfSlideVertUp
, div#apfSlides div.apfSlide div.apfSlideHead.noVertScroll div.apfSlideVertUp a
, div#apfSlides div.apfSlide div.apfSlideFooter.noVertScroll div.apfSlideVertDown a {
	display: none;
}

/** Set properties for the links inside the vertical scroll controls. **/
div#apfSlides div.apfSlide div.apfSlideHead div.apfSlideVertUp a
, div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideVertDown a {
	display: block;
	height: 18px;
	margin: 0 auto;
	width: 341px;
}

/******** Each slide's footer section. ********/
/** Anchor each slide's footer to the bottom. **/
div#apfSlides div.apfSlide div.apfSlideFooter {
	bottom: 0;
	height: 65px;
	position: absolute;
}

/** Format the info link and the back button. **/
div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideInfoLink {
	float: right;
	margin-top: 8px;
	width: 170px;
}

div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideInfoLink p {
	background: url(//www.ibm.com/software/info/js/apf/infoicon.png) no-repeat left center;
	color: #777;
	font-size: 11px;
	line-height: 13px;
	padding-left: 22px;
}

/** IE version of info link. **/
* html div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideInfoLink p {
	background: url(//www.ibm.com/software/info/js/apf/infoicon-ie6.gif) no-repeat left 40%;
}

div#apfSlides div.apfSlide div.apfSlideFooter div.apfSlideBack { margin-top: 5px; }


/******** Set properties for special home slide, override any other slide defaults. ********/
/** Viewport for the slide content for the home slide. 
	This doesn't matter, just needs to be big enough. Overflow is hidden.
**/
div#apfSlides div#apfHomeSlide div.apfSlideBodyCon {
	height: 280px;
}

/** Home slide buttons formatting. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul {
	list-style: none;	
	margin: 0;
	
}

div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li {
	color: #000;
	font-size: 18px;
	height: 55px;
	margin: 0px 0px 4px 0px;
	overflow: hidden;
	padding-left: 0px;
}

/** IE version of button LI. **/
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li {
	height: 45px;
	margin: 0px 0px 15px 5px;
}

div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li a {
	color: #000;
	display: block;
	font-size: 18px;
	height: 55px;
	line-height: 50px;
	text-decoration: none;
	text-indent: 65px;
	width: 518px;
}

/** IE version of button LI A. (10px less) **/
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li a {
	/**color: #000;
	font-size: 18px;**/
	height: 45px;
	line-height: 45px;
	width: 508px;
}

/******** Individual home slide button properties. ********/
/** Home slide "by business need" button. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbBusNeed a {
	background: url(//www.ibm.com/software/info/js/apf/bybusneed.png) no-repeat;
}
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbBusNeed a:hover {
	background-position: 0 -55px;
}

/** IE version **/
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbBusNeed a {
	background: url(//www.ibm.com/software/info/js/apf/bybusneed-ie6.png) no-repeat;
}
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbBusNeed a:hover {
	background-position: 0 -45px;
}

/** Home slide "by category" button. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbCat a {
	background: url(//www.ibm.com/software/info/js/apf/bycat.png) no-repeat;
}
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbCat a:hover {
	background-position: 0 -55px;
}

/** IE version **/
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbCat a {
	background: url(//www.ibm.com/software/info/js/apf/bycat-ie6.png) no-repeat;
}
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbCat a:hover {
	background-position: 0 -45px;
}

/** Home slide "by industry" button. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideVbLinks ul li#apfSlideVbInd a {
	background: none;
	display: none;
}

/******** Home slide search and atoz outer container. ********/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon { 
	position: relative;
}

/** IE version. **/
* html div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon { margin-top: 15px; }

div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div { margin-left: 5px; }

/** Titles for search and AtoZ containers. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideSearchCon div#apfSlideSearchTitle
, div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideAzCon div#apfSlideAzTitle { 
	font-size: 18px;
	font-weight: bold;
	padding-top: 3px;
}

/******** Home slide search container. ********/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideSearchCon {
	background: url(//www.ibm.com/software/info/js/apf/searchconbg.png) no-repeat;
	height: 70px;
	position: relative;
	width: 508px;
}

/** Home slide search button. **/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideSearchCon div#apfSlideSearchButton {
	position: absolute;
	left: 250px; 
	top: 29px;
	width: 87px;
}


/******** Home slide AtoZ container. ********/
div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideAzCon {
	background: url(//www.ibm.com/software/info/js/apf/atozconbg.png) no-repeat;
	height: 50px;
	margin-top: 15px;
	width: 508px;
}

/******** Format AtoZ letters. ********/
/** Only seen until JSON data is gotten and rewrites the P tag (removes class) **/
div#apfSlideAzLetters p.dnhls {
	letter-spacing: 10px;
}

div#apfSlides div#apfHomeSlide div.apfSlideBody div#apfSlideSazCon div#apfSlideAzCon div#apfSlideAzLetters {
	color: #D3D3D3;
	font-weight: bold;
	margin-left: 5px; /*offset the 2px padding below*/
	margin-top: -10px;
}

div#apfSlideAzLetters a {
	color: #4C6E94;
	margin-right: 0px;
	padding: 0px 5px;
	text-decoration: none;
}

div#apfSlideAzLetters span {
	margin-right: 0px;
	padding: 0px 5px;
}

div#apfSlideAzLetters a:first-child {
	margin-left: 0px;
	padding-left: 0px;
}

div#apfSlideAzLetters a:hover {
	text-decoration: underline;
}


/******** Tool launcher module formatting (left nav module). ********/	
div.apfModCon {
	/*background: url(//www.ibm.com/software/info/js/apf/apfbg.jpg) no-repeat scroll -280px 0px;*/
	/*border: 1px solid #ccc;*/
	/*padding: 5px 5px 0px 5px;
	margin: 15px 0px;*/
	/*width: 168px;   Usable inner space. Box ix 3px bigger in IE. */
}

div.apfModCon div.apfModConBody * {
    color: #777777;
    font-family: arial,sans-serif;
    font-size: 12px;
} 

/******** Module heading. ********/
div.apfModCon div.apfModConBody div.apfModHeading {
	font-weight: bold;
	color: #333;
	font-size: 18px;
	line-height: 29px; 
	margin-bottom: -6px;
	border-top: 2px solid #333333;
    letter-spacing: -1px;
    padding-top: 4px;
} 

/******** Module tool launch button. ********/
div.apfModCon div.apfModConBody div.apfModToolButton {
	background: url(//www.ibm.com/software/info/js/apf/modbuttonbg168.png) no-repeat scroll left top;
	font-weight: bold;
	line-height: 22px;
	margin: 10px auto 10px auto;
	position: relative;
	text-align: center;
}
* html div.apfModCon div.apfModConBody div.apfModToolButton {
	left: 1px;
}

div.apfModCon div.apfModConBody div.apfModToolButton a {
	background: url(//www.ibm.com/software/info/js/apf/modbuttonbg168.png) no-repeat scroll left top;
	color: #000;
	display: block;
width: 170px;}
	
div.apfModCon div.apfModConBody div.apfModToolButton a:hover {
	background-position: left -22px;
	text-decoration: none!important;
	color: #0C61C0;
}

/******** Module search container, label and field. ********/	
div.apfModCon div.apfModConBody div.apfModSearchCon label {
	display: block;
	margin-bottom: 3px;
}

div.apfModCon div.apfModConBody div.apfModSearchCon input#apfModTField {
	width: 294px;
}

div.apfModCon div.apfModConBody div.apfModSearchCon p {
	margin: 10px 0px 10px 0px;
}



/******** Abstract classes. ********/
.apfFieldHintText { color: #808080; }
.apfNd { display: none; }
