/*	http://html-css.info/2010/02/tooltip-title-css/	*/

/*  Для главной страницы сайта */

#index .tip{
		position:relative;
		z-index:1;

}
#index .tip em{display:none;}

#index .tip:hover em{
		padding:5px 20px;
		bottom: 35px;
		left:0px;	
		display:block;
		position:absolute;
		z-index:1;
		background-color:#CC0000;
		-webkit-border-radius:5px; /* красивости в виде скругленных углов */
		-moz-border-radius:5px;
		border-radius:5px;
		line-height:normal;
		color:#FFF;
		text-decoration:none;
		text-align: justify; 
		white-space: nowrap; /* Почему-то не срабатывает ??? */
		-webkit-box-shadow:0 0 5px #000; /* красивости в виде тени */
		-moz-box-shadow:0 0 5px #000;
		box-shadow:0 0 5px #000;
		opacity: 0.95;
		letter-spacing: 0px; /* интервал между символами */
		word-spacing: 1px;	 /* интервал между словами */
		width: 450px;
}
#index .tip:hover em i{
		position:absolute;
		z-index:1;
		bottom: -20px;
		left: 80px;
		border-top:20px solid #CC0000;
		border-left:10px solid transparent;
		border-right:10px solid transparent;
		_border-left:20px solid #CC0000; /* цвет фона. это для ие6.*/
		_border-right:20px solid #CC0000; /* цвет фона. это для ие6.*/
		display:block;
		height:0;
		overflow:hidden;
}


/* ------------------------------------------------------ */



#angel .tip{
		position:relative;
		z-index:1;

}
#angel .tip em{	
				display:none;
				font-size: 16px;
				}

#angel .tip:hover em{
		padding:10px 20px;
		bottom: 120px;
		left:-260px;	
		display:block;
		position:absolute;
		z-index:1;
		background-color:#CC0000;
		-webkit-border-radius:5px; /* красивости в виде скругленных углов */
		-moz-border-radius:5px;
		border-radius:5px;
		line-height:normal;
		color:#FFF;
		text-decoration:none;
		text-align: justify; 
		white-space: nowrap; /* Почему-то не срабатывает ??? */
		-webkit-box-shadow:0 0 5px #000; /* красивости в виде тени */
		-moz-box-shadow:0 0 5px #000;
		box-shadow:0 0 5px #000;
		opacity: 0.95;
		letter-spacing: 0px; /* интервал между символами */
		word-spacing: 1px;	 /* интервал между словами */
		width: 450px;
}
#angel .tip:hover em i{
		position:absolute;
		z-index:1;
		bottom: -20px;
		left: 295px;
		border-top:20px solid #CC0000;
		border-left:10px solid transparent;
		border-right:10px solid transparent;
		_border-left:20px solid #CC0000; /* цвет фона. это для ие6.*/
		_border-right:20px solid #CC0000; /* цвет фона. это для ие6.*/
		display:block;
		height:0;
		overflow:hidden;
}



/* ------------------------------------------------------ АПОКАЛИПСИС: */




#apocalypse .tip{
		position:relative;
		z-index:1;

}
#apocalypse .tip em{	
				display:none;
				font-size: 16px;
				}

#apocalypse .tip:hover em{
		padding:10px 20px;
		bottom: 120px;
		left:-260px;	
		display:block;
		position:absolute;
		z-index:1;
		background-color:#CC0000;
		-webkit-border-radius:5px; /* красивости в виде скругленных углов */
		-moz-border-radius:5px;
		border-radius:5px;
		line-height:normal;
		color:#FFF;
		text-decoration:none;
		text-align: justify; 
		white-space: nowrap; /* Почему-то не срабатывает ??? */
		-webkit-box-shadow:0 0 5px #000; /* красивости в виде тени */
		-moz-box-shadow:0 0 5px #000;
		box-shadow:0 0 5px #000;
		opacity: 0.95;
		letter-spacing: 0px; /* интервал между символами */
		word-spacing: 1px;	 /* интервал между словами */
		width: 450px;
}
#apocalypse .tip:hover em i{
		position:absolute;
		z-index:1;
		bottom: -20px;
		left: 295px;
		border-top:20px solid #CC0000;
		border-left:10px solid transparent;
		border-right:10px solid transparent;
		_border-left:20px solid #CC0000; /* цвет фона. это для ие6.*/
		_border-right:20px solid #CC0000; /* цвет фона. это для ие6.*/
		display:block;
		height:0;
		overflow:hidden;
}

/*---------------------------------------------------------*/
   /* http://www.03www.ru/css-2011/240211-017.html */

		.tooltip {
			border-bottom: 1px dotted #000000;
			color: #000000;			
			outline: none;
			cursor: help; 
			text-decoration: none;
			position: relative;
		}
		.tooltip span {
			margin-left: -999em;
			position: absolute;
		}
		.tooltip:hover span {
			border-radius: 5px 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px; 
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			font-family: Calibri, Tahoma, Geneva, sans-serif;
			position: absolute;
			left: 1em;
			top: 2em;
			z-index: 2;
			margin-left: 0;
			width: 250px;
		}
		.tooltip:hover img {
			border: 0; margin: -10px 0 0 -55px;
			float: left; position: absolute;
		}
		.tooltip:hover em {
			font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold;
			display: block; padding: 0.2em 0 0.6em 0;
		}
		.classic { padding: 0.8em 1em; }
		.classic {background: #FFFFAA; border: 1px solid #FFAD33; }
		.custom { padding: 0.5em 0.8em 0.8em 2em; }
		* html a:hover { background: transparent; }
		.critical { background: #FFCCAA; border: 1px solid #FF3334;	}
		.help { background: #9FDAEE; border: 1px solid #2BB0D7;	}
		.info { background: #9FDAEE; border: 1px solid #2BB0D7;	}
		._warning { background: #FFFFAA; border: 1px solid #FFAD33; }

/*---------------------------------------------------------*/

#tooltip {
			border-bottom: 1px dotted #000000;
			color:  #990000;
			outline: none;
			text-decoration: none;
			position: absolute;
			border-radius: 5px 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px; 
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			font-family: Calibri, Tahoma, Geneva, sans-serif;
			font-size: 115%;
			left: 1em;
			top: 2em;
			z-index: 1030;
			max-width: 300px;
			visibility: hidden;
		
			padding: 0.8em 1em; 
			background: #FFFFAA;
			border: 1px solid #FFAD33; 
		
			opacity: 0.93;
			filter: alpha(opacity="93");
			text-shadow: #000 1px 1px 2px;
			letter-spacing: 0px; /* интервал между символами */
			word-spacing: 5px;	 /* интервал между словами */
		}





#tooltip {
			font-family: Arial, Calibri, Tahoma, Geneva, sans-serif;

			color:#fff;		
			float:left;
			display:inline;
			background:#222;
			border:1px solid #fff;
			padding: 6px 10px; 
			font-size: 0.7em;
			font-weight: normal; 
			opacity: 0.9;
			filter: alpha(opacity="90");

			 box-shadow: 0px 0px 3px 3px #000;			/* Параметры тени */
			-webkit-box-shadow: 0px 0px 3px 3px #000;	/* Для Safari и Chrome */
			-moz-box-shadow: 0px 0px 3px 3px #000;		/* Для Firefox */
}

