@import url("../libs/jquery-ui/jquery-ui.css");

@font-face { font-family: Tungsten-Black; src: url('../font/Tungsten_OpenType/Tungsten-Black.otf'); } 
@font-face { font-family: Tungsten-Bold; src: url('../font/Tungsten_OpenType/Tungsten-Bold.otf'); }
@font-face { font-family: Tungsten-Medium; src: url('../font/Tungsten_OpenType/Tungsten-Medium.otf'); } 
@font-face { font-family: Tungsten-Semibold; src: url('../font/Tungsten_OpenType/Tungsten-Semibold.otf'); }

@font-face { font-family: Whitney-Medium; src: url('../font/Whitney_OpenType/Whitney-Medium-Pro.otf'); }

body
{
    margin-top:0px;
    margin-left:0px;
    width:990;
    height: 1000;
}

circle {
  fill: #aaa;
  stroke: #666;
  stroke-width: 1.5px;
}

.circleStyle
{
    position:absolute;
    left: 10px;
    top:10px;
	width: 10px;
	height: 10px;
	background-color: #ff3300;
	border-radius: 50%;
	background-image: url("../images/center.png");
    background-position: 50% 50%;
    background-repeat: no-repeat;
	-webkit-user-select: none;
	-moz-user-select: none;
	opacity:0.9;
}

.slider{
    width:80px;
    margin-bottom:30px;
}

.tooltip
{
    position:absolute;
    background-color:#000000;
    width:300px;
	display: none;
}

/* indice generale */
.bg-indiceGenerale{

}

.ui-body-c{
	background: none !important;
}


#slider1 input, #slider2 input, #slider3 input, 
#slider4 input, #slider5 input, #slider6 input{
	display: none;
}

.ui-field-contain div.ui-slider{
	width:135px !important;
	height: 10px !important;
}

.bg-indiceGenerale-indicarori{
    height: 30px;
    left: 177px;
    position: relative;
    top: 185px;
    width: 85px;
    float: left;
    z-index: 10001;
}

.bg-indiceGenerale-province{
    height: 30px;
    left: 192px;
    position: relative;
    top: 185px;
    width: 85px;
    float: left;
    z-index: 10001;
}

.popover_button{
	background-image: url("../images/btn_clear.png");
	background-repeat: none;
	height: 30px;
	width: 50px;
	line-height: 31px;
}

.popover_button:hover{
	cursor: pointer;
}


/* ************************************************ START */
#popover_indicatori .popover_triangle,
				#popover_province .popover_triangle{left:5px;}
				
				#popover_indicatori {
					color: black;
					display:none;
					font-weight: normal;
					line-height: 1;
					cursor: auto;
					position: absolute;
					top:233px;
					left:130px;
					background-color: white;
					z-index:5000000;
					border: 3px solid black;
					border-radius: 4px;
					-webkit-border-radius: 4px;
					-moz-border-radius: 4px;
					border-radius: 4px;
					-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					-webkit-transition: opacity 0.25s linear;
					-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					-moz-transition: opacity 0.25s linear;
					box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					transition: opacity 0.25s linear;
					height:311px;
				}
				
				#popover_province {
					color: black;
					display:none;
					font-weight: normal;
					line-height: 1;
					cursor: auto;
					position: absolute;
					top:233px;
					left:230px;
					background-color: white;
					z-index:5000000;
					border: 3px solid black;
					border-radius: 4px;
					-webkit-border-radius: 4px;
					-moz-border-radius: 4px;
					border-radius: 4px;
					-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					-webkit-transition: opacity 0.25s linear;
					-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					-moz-transition: opacity 0.25s linear;
					box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
					transition: opacity 0.25s linear;
					height:332px;
				}
				
				#popover_indicatori  > .popover_triangle, #popover_province > .popover_triangle {
				  position: absolute;
				  top: -34px;
					left:75px;
				  font-size: 0px;
				  line-height: 0%;
				  width: 0px;
				  border-top: 16px solid rgba(0,0,0,0);
				  border-left: 16px solid rgba(0,0,0,0);
				  border-right: 16px solid rgba(0,0,0,0);
				  border-bottom: 16px solid black; 
				}
				
				#popover_indicatori > .header,
				#popover_province > .header{
				  font-weight: bold;
				  margin: 0;
				  padding: 3px;
				  height: 35px;
				  line-height:25px;
				  text-shadow:rgba(0, 0, 0, 1) 0 -1px 0;
				  color: white;
					background: #222; /* old browsers */
					background: -moz-linear-gradient(top, #333 0%, #111 100%); /* firefox */
					background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.55)), color-stop(0.2, rgba(255, 255, 255, 0.35)), color-stop(0.5, rgba(255, 255, 255, 0.1)), color-stop(0.5, transparent), to(transparent) );
				  text-align: center; 
				}
				#popover_indicatori > .content,
				#popover_province > .content{
				  width: 190px;
				  max-height: 400px;
				  overflow-x: hidden;
				  overflow-y: auto;
				  font-size:12px;
				  height:290px;
				}
				
				#popover_indicatori > .content{
					height:270px;
				}
				
				#popover_indicatori > .content ul,
				#popover_province > .content ul {
					list-style:none;
					margin:0;	
					padding:0;
				}
				#popover_indicatori > .content ul li,
				#popover_province > .content ul li{
					line-height:44px;
					border-bottom:#ccc 1px solid;
					height: 44px;
				}
				
				#popover_indicatori > .content ul li.item:hover, #popover_province > .content ul li.item:hover {border-bottom:#1443BE 1px solid;}
				#popover_indicatori > .content ul li h6, #popover_province > .content ul li h6 {padding:0 10px;color:#000;font-size:13px;display:block;background:#f3f3f3;text-shadow:rgba(255, 255, 255, 1) 0 -1px 0;}
				#popover_indicatori > .content ul li a, #popover_province > .content ul li a{padding:0 14px;display:block;}
				#popover_indicatori > .content ul li a:link, #popover_indicatori > .content ul li a:visited,
				#popover_province > .content ul li a:link, #popover_province > .content ul li a:visited {text-decoration:none;color:#333;}
				#popover_indicatori > .content ul li a:focus, #popover_indicatori > .content ul li a:hover,
				#popover_province > .content ul li a:focus, #popover_province > .content ul li a:hover {
					text-decoration:none;color:#fff;
					background:#1C54E7 url('../images/arrow-small.png') 97% center no-repeat;
					text-shadow:rgba(0, 0, 0, .55) 0 -1px 0;
				}
					
					
					
					
				/* ignore everythign below here, its used to style the demo */
				.wrapper {margin:30px auto;width:700px;}
				footer {margin:400px 0 0 0;font-size:12px;}
				
				a#popover_button_province,
				a#popover_button_indicatori {
					border-radius: 3px;
				  -webkit-border-radius: 3px;
				  -moz-border-radius: 3px;
					padding:3px 10px;
					-webkit-transition: all .3s ease-in-out;
				  -moz-transition: all .3s ease-in-out;
				  -o-transition: all .3s ease-in-out;
				  text-transform:uppercase;
				  font-weight:bold;
				  font-size:11px;
				}
				a#popover_button_province:link, a#popover_button_province:visited,
				a#popover_button_indicatori:link, a#popover_button_indicatori:visited {
					border:1px solid #111;
					background:#222;
					color:#ccc;
					text-decoration:none;
				}
				a#popover_button_province:hover, a#popover_button_province:focus, a#popover_button_province.active,
				a#popover_button_indicatori:hover, a#popover_button_indicatori:focus, a#popover_button_indicatori.active {
					border:1px solid #000;
					background:#111;
					color:#fff;
					text-decoration:none;	
				}

/* **************************************************** END*/


/* ******************** indicatori */
.bg-indicatori{

} 

.indicatori_label{
	position:relative;
	top:148px;
	left:500px;
}

#indicatore_name{
	clear: both;
    color: #FFFFFF;
    font-family: Tungsten;
    font-size: 16pt;
    font-weight: normal;
    height: 36px;
    line-height: 35px;
    margin-left: 20px;
    text-align: center;
    width: 161px;
    text-shadow: none;
}

#statistica_1, #statistica_2, #statistica_3,
#statistica_4, #statistica_5, #statistica_6{
	color:#FFFFFF;
	font-family: Whitney-Medium;
	text-shadow: none;
	font-size:11pt;
	width: 200px;
	position:relative;
	height: 35px;
}

#statistica_1{
	top:10px;
}

#statistica_2{
	top:37px;
}
#statistica_3{
	top:64px;
}
#statistica_4{
	top:91px;
}
#statistica_5{
	top:115px;
}

#statistica_6{
	top:145px;
}

.indicatori_index2
{
    position:absolute;
    top:67px;
    left:0px;
}

.indicatori_index2 #indicatore_1,
.indicatori_index2 #indicatore_2,
.indicatori_index2 #indicatore_3,
.indicatori_index2 #indicatore_4,
.indicatori_index2 #indicatore_5,
.indicatori_index2 #indicatore_6{
	left:0px;
	width: 30px;
}

.indicatori_index2 #indicatore_2{
	top:102px;
}

.indicatori_index2 #indicatore_3{
	top:145px;
}

.indicatori_index2 #indicatore_4{
	top:198px;
}

.indicatori_index2 #indicatore_5{
	top:249px;
}

.indicatori_index2 #indicatore_6{
	top:302px;
}

.helpbtn {
    height: 23px;
    left: 137px;
    position: absolute;
    top: 52px;
    width: 161px;
}
.pophelp {
    background-image: url("../images/help.png");
    background-repeat: no-repeat;
    width: 289px;
    height: 878px;
    left: 52px;
    position: absolute;
    top: 76px;
    display: none;
    z-index: 10002;
}