@charset "utf-8";
/* CSS Document */
/* BARRAS */

	#chart2 {
		border: 1px solid #999;
		background: #f2f2f2; /*fondo de grafica y tablita*/
		box-shadow: 0 0 1em rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0 0 1em rgba(0, 0, 0, 0.5);
		-webkit-box-shadow: 0 0 1em rgba(0, 0, 0, 0.5);
		display: block;
 		margin: 5px;
  		float: left;
  		cursor: pointer;
  		width: 500px;
  		height:auto;
  		padding:10px;
		border-radius:10px;
		float:left;
		}
		
	.text{
		font-size:16px;
		color:#666666;
		font-family: Verdana, Geneva, sans-serif;
		text-align:center;
		}
	
	.leyendaGrafica{
		font-size:12px;
		color:#666666;
		font-family: Verdana, Geneva, sans-serif;
		text-align:center;
		}	
	
	.meter { 
		height: 40px;  /* Can be anything */
		position: relative;
		margin: 5px 0 5px 0; /* Just for demo spacing */
		background: #555;
		-moz-border-radius: 25px;
		-webkit-border-radius: 25px;
		border-radius: 5px;
		padding: 0px;
		-webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
		-moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
		box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);
		}
		
	.meter > span {
		display: block;
		height: 100%;
	   -webkit-border-top-right-radius: 2px;
		-webkit-border-bottom-right-radius: 2px;
		-moz-border-radius-topright: 2px;
			    -moz-border-radius-bottomright: 2px;
			           border-top-right-radius: 2px;
			        border-bottom-right-radius: 2px;
			    -webkit-border-top-left-radius: 5px;
			 -webkit-border-bottom-left-radius: 5px;
			        -moz-border-radius-topleft: 5px;
			     -moz-border-radius-bottomleft: 5px;
			            border-top-left-radius: 5px;
			         border-bottom-left-radius: 5px;
			background-color: rgb(43,194,83);
			background-image: -webkit-gradient(
			  linear,
			  left bottom,
			  left top,
			  color-stop(0, rgb(43,194,83)),
			  color-stop(1, rgb(84,240,84))
			 );
			background-image: -moz-linear-gradient(
			  center bottom,
			  rgb(43,194,83) 37%,
			  rgb(84,240,84) 69%
			 );
			-webkit-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			-moz-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			position: relative;
			overflow: hidden;
		}
		.meter > span:after, .animate > span > span {
			content: "";
			position: absolute;
			top: 0; left: 0; bottom: 0; right: 0;
			background-image: 
			   -webkit-gradient(linear, 0 0, 100% 100%, 
			      color-stop(.25, rgba(255, 255, 255, .2)), 
			      color-stop(.25, transparent), color-stop(.5, transparent), 
			      color-stop(.5, rgba(255, 255, 255, .2)), 
			      color-stop(.75, rgba(255, 255, 255, .2)), 
			      color-stop(.75, transparent), to(transparent)
			   );
			background-image: 
				-moz-linear-gradient(
				  -45deg, 
			      rgba(255, 255, 255, .2) 25%, 
			      transparent 25%, 
			      transparent 50%, 
			      rgba(255, 255, 255, .2) 50%, 
			      rgba(255, 255, 255, .2) 75%, 
			      transparent 75%, 
			      transparent
			   );
			z-index: 1;
			-webkit-background-size: 50px 50px;
			-moz-background-size: 50px 50px;
			-webkit-animation: move 2s linear infinite;
			   -webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;
			overflow: hidden;
		}
		
		.animate > span:after {
			display: none;
		}
		
		@-webkit-keyframes move {
		    0% {
		       background-position: 0 0;
		    }
		    100% {
		       background-position: 50px 50px;
		    }
		}
		
/* COLORES DE LAS BARRAS */		
		.green > span{
		    background: #090;
    background: -moz-linear-gradient(top, #090 0%, #0C0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #090), color-stop(100%, #0C0));
    background: -webkit-linear-gradient(top, #090 0%, #0C0 100%);
    background: -o-linear-gradient(top, #090 0%, #0C0 100%);
    background: -ms-linear-gradient(top, #090 0%, #0C0 100%);
    background: linear-gradient(to bottom, #090 0%, #0C0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#090', endColorstr='#0C0',GradientType=0);
				}
		
		.fuchsia > span {
			  background: #90C;
    background: -moz-linear-gradient(top, #90C 0%, #96F 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a1d4e6), color-stop(100%, #6bb4d1));
    background: -webkit-linear-gradient(top, #90C 0%, #96F 100%);
    background: -o-linear-gradient(top, #90C 0%, #96F 100%);
    background: -ms-linear-gradient(top, #90C 0%, #96F 100%);
    background: linear-gradient(to bottom, #90C 0%, #96F 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#90C', endColorstr='#96F',GradientType=0);
		}
		
		.orange > span {
		    background: #F60;
    background: -moz-linear-gradient(top, #F60 0%, #F90 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F60), color-stop(100%, #F90));
    background: -webkit-linear-gradient(top, #F60 0%, #F90 100%);
    background: -o-linear-gradient(top, #F60 0%, #F90 100%);
    background: -ms-linear-gradient(top, #F60 0%, #F90 100%);
    background: linear-gradient(to bottom, #F60 0%, #F90 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F60', endColorstr='#F90',GradientType=0);
		}
		
		.aqua > span {
		    background: #06F;
    background: -moz-linear-gradient(top, #06F 0%, #0CF 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #06F), color-stop(100%, #0CF));
    background: -webkit-linear-gradient(top, #06F 0%, #0CF 100%);
    background: -o-linear-gradient(top, #06F 0%, #0CF 100%);
    background: -ms-linear-gradient(top, #06F 0%, #0CF 100%);
    background: linear-gradient(to bottom, #06F 0%, #0CF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#06F', endColorstr='#0CF',GradientType=0);
		}
		
				.red > span {
		    background: #c80912;
    background: -moz-linear-gradient(top, #c80912 0%, #d90c16 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c80912), color-stop(100%, #d90c16));
    background: -webkit-linear-gradient(top, #c80912 0%, #d90c16 100%);
    background: -o-linear-gradient(top, #c80912 0%, #d90c16 100%);
    background: -ms-linear-gradient(top, #c80912 0%, #d90c16 100%);
    background: linear-gradient(to bottom, #c80912 0%, #d90c16 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c80912', endColorstr='#d90c16',GradientType=0);
		}
		
		.blue > span {
		    background: #252ff4;
    background: -moz-linear-gradient(top, #252ff4 0%, #4e55ec 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #252ff4), color-stop(100%, #4e55ec));
    background: -webkit-linear-gradient(top, #252ff4 0%, #4e55ec 100%);
    background: -o-linear-gradient(top, #252ff4 0%, #4e55ec 100%);
    background: -ms-linear-gradient(top, #252ff4 0%, #4e55ec 100%);
    background: linear-gradient(to bottom, #252ff4 0%, #4e55ec 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#252ff4', endColorstr='#4e55ec',GradientType=0);
		}

		.yellow > span {
		    background: #f2ea04;
    background: -moz-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2ea04), color-stop(100%, #fbf54b));
    background: -webkit-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -o-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -ms-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: linear-gradient(to bottom, #f2ea04 0%, #fbf54b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2ea04', endColorstr='#fbf54b',GradientType=0);
		}
		
		.yellow > span {
		    background: #f2ea04;
    background: -moz-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2ea04), color-stop(100%, #fbf54b));
    background: -webkit-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -o-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: -ms-linear-gradient(top, #f2ea04 0%, #fbf54b 100%);
    background: linear-gradient(to bottom, #f2ea04 0%, #fbf54b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2ea04', endColorstr='#fbf54b',GradientType=0);
		}
		
		.nostripes > span > span, .nostripes > span:after {
			-webkit-animation: none;
			background-image: none;
		}