
.slideOutTip2{
	/* The main wrapping div of the slideout tips */
	position:absolute;
	padding:3px;
	top:0;
	left:0;
	background-color:#444;
	font-size:11px;
	color:white;
	overflow:hidden;
	height:14px;
	opacity:0.9;
	filter:alpha(opacity=90);
	border:1px dotted #777;	
}

.slideOutTip2:hover{
	/* Applying a CSS3 outer glow on hover */
	-moz-box-shadow:0 0 1px #999;
	-webkit-box-shadow:0 0 1px #999;
	box-shadow:0 0 1px #999;
}

/* The holder for the title and the icon: */
.tipVisible{ cursor:pointer; height:14px; }

.tipTitle{
	float:left;
	font-family:Helvetica, Arial, sans-serif;
	font-size:11px;
	text-transform:uppercase;
	font-weight:bold;
	white-space:nowrap;
	padding:0;
	margin:0;
	line-height:12px;
}

.tipIcon{
	width:10px;
	height:10px;
	float:left;
	background-color:#61b035;
	border:1px solid #70c244;
	margin-right:4px;
	
	/* CSS3 Rounded corners */
	
	-moz-border-radius:1px;
	-webkit-border-radius:1px;
	border-radius:1px;
}

/* Three color themes */
.green .tipIcon{ background-color:#61b035; border:1px solid #777; }
.blue .tipIcon{ background-color:#6486c4; border:1px solid #4b65af; }
.orange .tipIcon{ background-color:#f8981e; border:1px solid #777; }

.plusIcon{
	/* The plus icon */
	width:10px;
	height:10px;
	background:url('img/plus.gif') no-repeat center center;
	margin:0;
	
	/* Defining a CSS3 animation. Currently only works in Chrome and Safari */
	-webkit-transition: -webkit-transform 0.2s linear;
	-moz-transition: -moz-transform 0.2s linear;
	transition: transform 0.2s linear;
}

.slideOutTip2.isOpened{ z-index:10000;  }

.slideOutTip2.isOpened .plusIcon{
	/* Applying a CSS3 rotation  to the opened slideouts*/
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}

/* Special rules for the left and top - opening versions */

.openLeft .tipIcon{
	/* Floating the title and the icon to the right */
	margin:0 0 0 4px;
	float:right;
}
.openLeft .tipTitle{ float:right; padding:0; margin:0; line-height:12px; }
.openLeft .slideOutContent2{ margin-top:10px; }
.openLeft.openTop .slideOutContent2{ margin-top:0; }


.slideOutContent2{
	/* Hiding the div with the slide out content: */
	display:none;
	padding:10px;
	font-size:11px;
	line-height:12px; 
	width:200px;
}

/* Hiding the original paragraphs if they have not been replaced (JS disabled): */

.usmaptips > p{ display:none; margin:0; padding:0;  }
.usmaptips a, .usmaptips a:active, .usmaptips a:visited, .usmaptips a:link { color:#f8981e; text-decoration:none; }
.usmaptips a:hover { color:#fff; text-decoration:none; }

/* The styles below are only necessary for the styling of the demo page: */

.usmaptips{
	margin:0 auto;
	position:relative;
	width:900px;
	height:487px;
	background:url('img/usmap.jpg') no-repeat top left;
	font-size:11px;
	line-height:12px;
	font-family:Helvetica, Arial, Sans-Serif;
	padding:0;
}

.spaceBottom{
	margin:0 0 5px;
}

.spaceTop{
	margin:5px 0 0;
}
