/****************************************************************/
/*  JQUERY POPUPS STYLES                                        */
/*  ----------------------------------------------------------  */
/*  Modified: 11-JAN-2010 (JAM)                                 */
/*                                                              */
/****************************************************************/


/* global */
#cluetip {position: relative;}
#cluetip-close img {border: 0;}
#cluetip-title {overflow: hidden;}
#cluetip-title #cluetip-close {float: right; position: relative; top: 1px; padding-left: 10px;}



#cluetip-waitimage {width: 33px; height: 8px; position: absolute; background: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/wait.gif) no-repeat;}
.cluetip-arrows {display: none; position: absolute; top: 0; left: -11px; height: 24px; width: 11px; background-repeat: no-repeat; background-position: 0 0;}
#cluetip-extra {display: none;}

/***************************************
   =cluetipClass: 'default' 
-------------------------------------- */

.cluetip-default {background: #f00; margin-top: 1px; _margin-top: 0;}
.cluetip-default #cluetip-outer {position: relative; margin: 0; background-color: #fff; border: 4px solid #BD8621; border-top: 1px solid #BD8621;}
.cluetip-default h3#cluetip-title {margin: 0; padding: 2px 0 4px 10px; font-size: 80%; font-weight: bold; background-color: #BD8621; color: #fff;}
.cluetip-default #cluetip-title a {color: #d9d9c2; font-size: 0.95em;} 
.cluetip-default div#cluetip-close {text-align: right; padding-right: 5px; color: #900;} 
.cluetip-default #cluetip-inner {padding: 10px; margin-top: -14px;}


/* Brown arrows for role description popups (JUL-2008)
--------------------------------------------------------------- */
.clue-right-default .cluetip-arrows {background: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/clueTip_arrowleft.gif) no-repeat left 1px;}
.clue-left-default .cluetip-arrows {background-image: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/clueTip_arrowright.gif); left: 100%; margin-right: -11px;}
.clue-top-default .cluetip-arrows {background-image: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/clueTip_arrowdown.gif); top: 0; left: 50%; margin-left: -11px; height: 11px; width: 22px;}  
.clue-bottom-default .cluetip-arrows {background-image: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/clueTip_arrowup.gif); top: -11px; left: 50%; margin-left: -11px; height: 11px; width: 22px;}


/* Forrester styles */

a.infoPopup {float:right; width: 39px; margin-top: 4px; outline: none; min-height: 15px;}
a.infoPopup img {margin: 0;}
#infoPopupContent p,
#infoPopupContent ul {padding: 0; margin: 1em 0 .5em; font-size: 70%;}
#infoPopupContent ul {margin-left: 1em; padding-left: 1em;}
#infoPopupContent ul li {margin: 0; padding: 0 0 3px 0; _padding: 0;}
#infoPopupContent ul ul {font-size: 100%; margin-top: .5em;}



/* Rounded green popup for endnotes on Waves (AUG-2008)
--------------------------------------------------------------- */
/***************************************
   =cluetipClass: 'rounded'
-------------------------------------- */

.cluetip-rounded {
	background: transparent url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/bl.gif) no-repeat 0 100%;
	margin-top: 10px;
	margin-left: 12px;
	}

.cluetip-rounded #cluetip-outer {
	background: transparent url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/tl.gif) no-repeat 0 0;
	margin-top: -12px;
	}

.cluetip-rounded h3#cluetip-title {
	background-color: transparent;
	padding: 8px 0 0px 0;
	margin: 0 0 0 15px;
	position: relative;
	text-transform: uppercase;
	color: #879a58;
	border-bottom: 2px solid #879a58;
	}
  
.cluetip-rounded #cluetip-extra {
	position: absolute;
	display: block;
	background: transparent url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/tr.gif) no-repeat 100% 0;
	top: 0;
	right: 0;
	width: 12px;
	height: 30px;
	margin: -12px -12px 0 0;
	_margin-right: -12px;
	}
	
.cluetip-rounded #cluetip-inner {
	background: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/br.gif) no-repeat 100% 100%;
	padding: 12px 16px 15px 16px;
	margin: -5px -12px 0 0;
	position: relative;
	font-size: 85%;
	line-height: 1.3em;
	}

.cluetip-rounded #cluetip-inner div {
	/* crops extra long unbreaking text in popups (Badger 22452) */
	overflow: hidden;
	}

.cluetip-rounded #cluetip-inner a {text-decoration: underline;}


/* Displayed on regular page, but hidden in the popup
--------------------------------------------------------------- */
p.hideFromPopup, div.hideFromPopup {display: block;}
a.hideFromPopup, span.hideFromPopup {display: inline;}
.cluetip-rounded #cluetip-inner .hideFromPopup {display: none;}
	
/* Hidden on regular page, but displays in the popup
--------------------------------------------------------------- */
.showInPopup {display: none;}
.cluetip-rounded #cluetip-inner p.showInPopup, .cluetip-rounded #cluetip-inner div.showInPopup {display: block;}
.cluetip-rounded #cluetip-inner a.showInPopup, .cluetip-rounded #cluetip-inner span.showInPopup {display: inline;}

.cluetip-rounded div#cluetip-close {
	position: relative;
	text-align: right;
	background: transparent;
	text-transform: none;
	}
.cluetip-rounded div#cluetip-close a {
	color: #949494;
	background: url(http://a964.g.akamaitech.net/f/964/714/1h/www.forrester.com/role_based/images/i_popupClose_grey.gif) no-repeat 2px .1em;
	padding: 0 7px 0 18px;
	display: block;
	margin-bottom: 4px;
	}

.cluetip-rounded div#cluetip-close a:hover {text-decoration: underline;}	



/* --- stupid IE6 HasLayout hack --- */
.cluetip-rounded #cluetip-title,
.cluetip-rounded #cluetip-inner {zoom: 1;}