<style>
/** {
margin:0;
padding:0;
font-size: 0px
}
ul {
list-style-type:none;
padding:0px;
margin:0px
}
li {
padding:0px;
margin:0px	
}
body {
	margin:0;
	padding:0
}*/


.graph_tabla {
	width:100%;
	display:table;
	vertical-align:middle;
	border-collapse:separate;
	table-layout: fixed
}
.graph_tabla li {
	display:table-cell;
	vertical-align:middle;
	width:50%;
}

.graph_base, .graph_base2 {
font-family: 'Lato', Calibri, Arial, sans-serif;
font-weight: 100;
text-shadow:1px 2px 3px rgba(0,0,0,1);
font-size:1.8vw;
color:#fff;
letter-spacing: 0.5px;
overflow:hidden;
text-align:center
}
.graph_base2 {
font-size:2.4vw
}

.graph_base h1, .graph_base2 h1 {
	margin:0;
	font-size:1.8em;
}

.graph_base img, .graph_base2 img {
	max-width:100%;
	max-height:100%;
	
}
.graph_list {
	
    overflow: hidden;
	width:100%;
	font-size:1.0em
}
.graph_list li {
	display:block;
	width:100%;
	padding:1% 0px;
}


.graph_list_2 {
	margin:0 0 0 20%;
	text-align:left;
	padding:0 0 5% 0;
	font-size:0.8em
}

/*.graph_list_2 li:before {
    content:"\00b7";
    padding:0 2% 0 0;
}*/


.graph_line {
	height:1px;
	background-color:#080c11;
	border-bottom:1px solid #474d54;
	line-height:1px !important;
	font-size:1px !important;
	padding:0px !important
}

.graph_circulo {
	background-image: url('../g_img/g_circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	font-size:0.9em
}


.graph_circulo_Num {
	display:inline-block;
	margin: 0 5% 0;
	padding:3.2%;
	font-size:2.6vw;
	vertical-align:middle;
	background-image: url('../g_img/g_circle_2.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center
	
}

.graph_size {
width:90%;
margin:0 auto
}
.graph_border_01 { 
background-color: #262f38;
border-radius:0.8em;
padding: 3%
}

.graph_border_02_Titulo {
width:60%;
margin:0 auto;
padding:0 0 1%
}
.graph_border_02_Titulo span{
font-size:0.8em
}


.graph_border_02_A {
	background-color:#000;
	border-radius:0.8em 0.8em 0 0
}
.graph_border_02_B {
	background-color:#262f38;
	border-radius:0 0 0.8em 0.8em;
	margin-top:-1px
}

.graph_border_03_A {
	background-color:#262f38;
	border-radius:0.8em 0.8em 0 0
}
.graph_border_03_B {
	background-color:#07080a;
	border-radius:0 0 0.8em 0.8em;
	margin-top:-1px
}


.graph_container {
	background-image: url('../g_img/a2b_back.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right
}

	
@media (max-width: 650px) {
	.graph_size {
		width:90% !important
	}
	.graph_base, .graph_base2 {
		font-size:15px;
		font-size:3.0vw/*16*/
	}
	.graph_tabla {
		padding:0 !important
	}
	.graph_circulo{
		font-size:0.7em
	}
}

/* Cambio tipo de grafico */
@media (min-width: 500px) {
	#GraficoTipo2 {
		display:none
	}


}
@media (max-width: 500px) {
	.graph_circulo{
		font-size:0.8em
	}
	.graph_circulo_Num {
		margin: 0 5% 0 2%;
	}
	.graph_size {
		width:95% !important
	}
	.graph_border_02_Titulo {
		width:70%
	}
	.graph_base, .graph_base2 {
		font-size:14px;
		font-size:3.5vw
	}
	#GraficoTipo1 {
		display:none
	}
	#GraficoTipo2 {
		display:block
	}
}
/* --------------------- */

@media (max-width: 350px) {

	.graph_base, .graph_base2 {
		font-size:12px
	}
	.graph_list_2 {
		margin:0 0 0 15%;
	}
}

@media (max-width: 250px) {

	.graph_base, .graph_base2 {
		font-size:10px
	}
	.graph_base h1, .graph_base2 h1  {
		font-size:18px
	}
	.graph_border_02_Titulo span{
		font-size:0.9em
	}
	.graph_list_2 {
		margin:0 0 0 10%;
	}
}

</style>