body {position: relative; width: 990px; margin:auto; height:500px;}
body *{outline: transparent !important; font-family:'Helvetica', 'Arial',sans-serif !important; color: #87868a; font-size:14px;}	
body *::-moz-focus-inner {border: 0 !important;}

/* CLASES GENERALES */
.cb{clear:both;}

span.color_p, span.txt_p{ display:inline-block;height:15px;float:left; }
span.porc_p{ display:inline-block;height:15px;float:right; }
span.color_p{ width:6px; margin-right:5px;}
span.color_p.ppcolor{ background-color:#2a91d5; }
span.color_p.psoecolor{ background-color:#e32d42; }
span.color_p.cscolor{ background-color:#eb6615; }
span.color_p.podcolor{ background-color:#AA3345; }
span.color_p.cdccolor{ background-color:#124162; }
span.color_p.erccolor{ background-color:#F79F21; }
span.color_p.cupcolor{ background-color:#FFED00; }

span.txt_p{margin-right:25px;}

span.color_p.color_p_big, span.txt_p.txt_p_big, span.porc_p.porc_p_big{height:28px; font-size:27px;}
span.txt_p.txt_p_big{margin-right:0px;}
span.color_p.color_p_big{margin-right:10px;}

#container{
	width:100%;
	max-width:990px;
	margin:25px auto;
	height:500px;
	background-color:white;
	font-size:15px;
	color:#1a1a1a;
	position:relative;
	opacity:0;
}

/* LOADING*/
#pre{position:absolute; width:100%; top:150px; text-align:center;}

/* ZONA IZQUIERDA: DATAVIZ*/
#dataviz{ float:left; width:750px; height:400px;}

#cabecera{ padding:10px 0px; position:relative; height:30px; margin-left:35px;}
#party_colors{ float:left; }
#party_colors div{display:inline-block; cursor:pointer;
	-webkit-transition: all 200ms linear; -moz-transition: all 200ms linear;
	-o-transition: all 200ms linear; -ms-transition: all 200ms linear; transition: all 200ms linear;
}

#party_colors div.buttCheck{ padding:5px; border:1px solid lightgrey; border-radius:3px; margin-right:8px;} 
#party_colors div.buttCheck span.color_p, #party_colors div.buttCheck span.txt_p{height:13px;}
#party_colors div.buttCheck span.color_p{width:5px;}
#party_colors div.buttCheck span.txt_p{margin-right:0px; font-size:13px;}

#party_colors div.buttCheck span.checkCont{ display:inline-block; float:left;width:13px; height:13px; }
#party_colors div.buttCheck span.checkCont svg{width:14px; height:14px;}
body.tabletNot #party_colors div.buttCheck span.checkCont svg path{ fill:white;
	-webkit-transition: fill 200ms linear; -moz-transition: fill 200ms linear;
	-o-transition: fill 200ms linear; -ms-transition: fill 200ms linear; transition: fill 200ms linear;
}

#party_colors div.buttCheck.activo.pp span.checkCont svg path{fill:#2a91d5;}
#party_colors div.buttCheck.activo.psoe span.checkCont svg path{fill:#e32d42;}
#party_colors div.buttCheck.activo.cs span.checkCont svg path{fill:#eb6615;}
#party_colors div.buttCheck.activo.pod span.checkCont svg path{fill:#AA3345;}
#party_colors div.buttCheck.activo.cdc span.checkCont svg path{fill:#124162;}
#party_colors div.buttCheck.activo.erc span.checkCont svg path{fill:#F79F21;}
#party_colors div.buttCheck.activo.cup span.checkCont svg path{fill:#FFED00;}

span.color_p.ppcolor{background-color:#2a91d5;}
span.color_p.psoecolor{background-color:#e32d42;}
span.color_p.cscolor{background-color:#eb6615;}
span.color_p.podcolor{background-color:#AA3345;}
span.color_p.cdccolor{background-color:#124162;}
span.color_p.erccolor{background-color:#F79F21;}
span.color_p.cupcolor{background-color:#FFED00;}

#party_colors div.inactivo{opacity:0.3;}

select#cambioVariacion{ 
	display:block; 
	float:right; 
	margin-right:20px;
	padding:4px; 
	width:210px; 
	border: 1px solid lightgrey !important; 
	border-radius:3px;
	background-color:white;
	font-family:'Helvetica, Arial'; 
	font-size:13px;
	max-height:200px;
}
select#cambioVariacion option{
	font-size:13px;
}

#cabecera #reiniciarPartidos{display:none; position:absolute; top:10px; left:-33px; cursor:default;}
#cabecera #reiniciarPartidos button { 
	height:25px; line-height:24px; border:1px solid lightgrey; border-radius:3px; 
cursor:pointer; background-color:white; padding:0px;}
#cabecera #reiniciarPartidos span{display:block; float:left;}
#cabecera #reiniciarPartidos span svg{width:20px; height:20px; padding:2px; padding-bottom:0px;}



#d3_container{padding-top:10px; padding-left:10px; width:100%; }
#d3_container svg{margin-left:0px; padding-right:15px;}

#d3_container svg .axis path { display: none; }
#d3_container svg .axis line { shape-rendering: crispEdges; stroke: lightgrey; opacity:0.5;}
#d3_container svg .axis .minor line { stroke: lightgrey;}
#d3_container svg .x.axis .tick.major line{opacity:1;}
#d3_container svg .x.axis .tick.major text{font-size:13px;}
#d3_container svg .axis{fill:#87868a;}

#d3_container  svg .circulos{cursor:pointer;}

body.tabletNot #d3_container  svg .circulos{ 
	-webkit-transition: opacity 200ms linear; -moz-transition: opacity 200ms linear;
	-o-transition: opacity 200ms linear; -ms-transition: opacity 200ms linear; transition:opacity 200ms linear;
}

#d3_container svg .circulos.casaSel{fill:#ffffff; stroke-width:1.5px; opacity:1;}
#d3_container  svg .circuloOn{opacity:1;}
#d3_container  svg .circuloOff{opacity:0.1;}
#d3_container  svg .circuloDes{opacity:0.2; fill:#f6f6f6 !important;}
#d3_container svg .circulos.mostrando{opacity:1;}
#d3_container svg .circulos.mostrando.casaSel{fill:#ffffff; stroke-width:1.5px; opacity:1;}
#d3_container svg .circuloHito{cursor:pointer; opacity:0.7; fill:#87868a;}
#d3_container svg .circuloHito:hover{opacity:1;}

body.tabletNot #d3_container svg .line{
	-webkit-transition: opacity 200ms linear; -moz-transition: opacity 200ms linear; transition:opacity 200ms linear;
	-o-transition: opacity 200ms linear; -ms-transition: opacity 200ms linear; 
}

#d3_container svg .line {fill: none; stroke-width: 2.3px; cursor:pointer;}
#d3_container  svg .line.lineOn{stroke-width:3px;}
#d3_container  svg .line.lineOff{opacity:0.1;}
#d3_container  svg .lineHito{ opacity:0; fill:none; stroke:#87868a; stroke-width:0.8px; stroke-dasharray: 4, 4;}
#d3_container  svg .textoHito{opacity:0;}
#d3_container  svg .textoHito tspan{font-size:11px; fill:#87868a;}

#d3_container svg .circuloHito.hitoResalt{ fill:#fff; stroke: #0C3048 !important; stroke-width:2px; /*4f8e3a*/}
#d3_container svg .textoHito.hitoResalt tspan{ fill: #0C3048 !important; font-size:12px; }
#d3_container svg path.hitoResalt{ stroke: #0C3048 !important ; /*4f8e3a*/ }

#d3_container  svg .sinEventos{opacity:0.1 !important; cursor:default !important; }
#d3_container  svg .conEventos{opacity:1 !important;}

#d3_container  svg .lineHito, #d3_container  svg .textoHito, #d3_container  svg .textoHito{
	-webkit-transition: opacity 200ms linear; -moz-transition: opacity 200ms linear; transition:opacity 200ms linear;
	-o-transition: opacity 200ms linear; -ms-transition: opacity 200ms linear;
}
#d3_container  svg .lineHito.hitoOn, #d3_container  svg .textoHito.hitoOn, #d3_container  svg .circuloHito.hitoOn{opacity:1;}

/* ZONA DERECHA: INFO ENCUESTA */
#info{ float:right; width:220px; margin-right:10px; position:relative;}

#info #sombrica{position:absolute; top:10px; left:-20px;}

#info_explicativo_inicial{ position:absolute; width:220px; left:0px; top:10px; border: 1px dashed lightgrey; opacity:0.7;}
#info_explicativo_inicial span { display:block; font-size:11px; line-height:15px;text-align:center; padding:10px; font-size:12px;}

#info_guiner{margin-top:130px;height:50px;}
#info_encuesta{margin-top:10px;}
#info_fecha{font-size:15px; text-align:left;}

#info_casamedio{height:30px;margin-top:5px;}
#info_casamedio span{padding-top:8px; display:block;font-size:15px;}
#info_casamedio #info_casa{float:left;}

#info_partys{margin-top:15px;}
#info_partys p{display:block; width:100%; height:30px;}