/*******************************************************************************
   aqi.css
   
   Standard CSS include stylesheet for AQI
*******************************************************************************/

.aqibox {
	position: relative;
	font: 13px Arial, sans-serif;
	display: block;
	width: 75px; 
	padding: 1px; 
	margin: 2px; 
	text-align: center; 
}

.aqibox small {
	position: absolute;
	right: 1px;
	top: 1px;
	font: 7px Arial, sans-serif;
}

.aqi_None, .aqi_cat0 {
	color: black !important;
	background-color: #eee !important;
}

.aqi_Good, .aqi_cat1, .aqi_Green {
	color: black !important;
	background-color: #00E400 !important;
}

.aqi_Mod, .aqi_cat2, .aqi_Yellow {
	color: black !important ;
	background-color: #FFFF00 !important;
}

.aqi_USG, .aqi_cat3, .aqi_Orange {
	color: white !important; 
	background-color: #FF7E00 !important;
}

.aqi_Unh, .aqi_cat4, .aqi_Red {
	color: white !important; 
	background-color: #FF0000 !important;
}

.aqi_VUh, .aqi_cat5, .aqi_Purple {
	color: white !important; 
	background-color: #99004C !important;
}

.aqi_Haz, .aqi_cat6, .aqi_Maroon {
	color: white !important; 
	background-color: #7e0023 !important;
}

a.info
{
    position:relative;
    cursor:help;
    background-color:white;
}
a.info:hover
{
	z-index:25; 
	background-color:#ffffff;
	text-decoration:none;
}

a.info span
{
	display: none;
	background-color:#f5f5f5;
}
a.info:hover span
{ 
	/*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:20em;
    border:1px solid #000000;
    background-color:#f5f5f5; 
    color:#000;
    font-weight:normal;
    text-align: left;
    text-decoration:none;
    padding: 10px 10px 10px 10px;
}

a.info img {
	border: none;
	text-decoration: none;
}