/* CSS Document */

.year_form{ width:100%; clear:both; display:block; float:left;}
h2.map_year{ float:left; font-family:'Benton Sans',Arial, Helvetica, sans-serif; font-weight:600; font-size:28px; display:block;} 

.select_year_cont{ float:right;font-size:14px; font-weight:bold;}
.select_year_cont label{ }
.select_year_cont select{ border:1px solid #CCC; padding:7px; border-radius:3px; margin-left:5px; background:#EBEBEB; }

.graph_results{ margin:20px 0 40px;width:100%; clear:both; display:block; /*float:left;*/}

.graph_results_inner{position:relative; padding:25px 90px;}
.graph_results .candidate{ position:absolute; top:0}
.graph_results .candidate figure img{ border-radius: 100%; border: 3px solid #CCC; padding: 2px; width:100px; background:#FFF;} 
.graph_results .candidate figure h2{ font-weight:bold; font-size:14px; text-transform:uppercase; position:absolute; top:0; font-family:'Benton Sans', Arial, Helvetica, sans-serif; display:inline-block; white-space: nowrap; width:170px;}
.graph_results .candidate figure strong{ font-weight:bold; font-size:13px; position:absolute; top:75px; font-family:'Benton Sans', Arial, Helvetica, sans-serif; display:inline-block; white-space: nowrap; width:170px;}

.graph_results .democratic_candidate{ left:0;}
.graph_results .republican_candidate{ right:0;}
.graph_results .democratic_candidate figure img{  border-color:#0077FF;}
.graph_results .republican_candidate figure img{ border-color:#E31347;}
.graph_results .democratic_candidate figure h2{color:#0077FF; left:100px; text-align:left;}
.graph_results .republican_candidate figure h2{color:#E31347; right:100px; text-align:right;}
.graph_results .democratic_candidate figure strong{left:100px; text-align:left;}
.graph_results .republican_candidate figure strong{right:100px; text-align:right;}


.graph_results .bar_results { height: 50px; background: #EBEBEB; width: 100%; position: relative;}
.graph_results .bar_results .democratic_bar{ -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; position:absolute; top:0; left:0; height:50px; width: 0; background-color:#0077FF;}
.graph_results .bar_results .republican_bar{ -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; position:absolute; top:0; right:0; height:50px; width: 0; background-color:#E31347;}
.graph_results .bar_results .votes_number{ color:#FFF; font-weight:bold; font-size:28px; line-height:50px; padding:0 15px; position: relative; z-index: 9;}
.graph_results .bar_results .republican_bar .votes_number{ text-align:right; float:right;}

.graph_results .bar_results:before { position: absolute; height: 70px; width: 5px; left: calc(50% - 3px); top: 50%; transform: translate(0, -50%);  z-index: 10; content: ''; border: 2px solid #FFF; background:#000;}
.graph_results .majority{/*position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); height: 110px; text-align: center; width: 150px; font-size:11px; font-weight:bold; text-transform:uppercase; line-height:120%;*/

position: absolute; left: 50%; top: 85px; margin-left: -75px; text-align: center; width: 150px; font-size:11px; font-weight:bold; text-transform:uppercase; line-height:120%;

}
.graph_results .majority p {  /*position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); width:100%;*/}
.graph_results .majority p span{ display:block}

.map_results { position: relative; }
.map_results.frontPage path:hover, .map_results.frontPage circle:hover, .map_results.frontPage rect:hover{cursor:pointer;}

.console_buttons{ border-top:5px solid #F9F9F9; position:relative; width:100%; padding: 0; margin:20px 0 0; float:left; clear:both; width:100%; }
.console_buttons:before{ border-top:1px solid #EBEBEB; position:absolute; top:0; left:0; content:''; width:100%;}

.console_buttons p{font-size:14px; font-weight:bold; text-transform:uppercase; color:#555; margin-bottom:5px;}
.console_buttons button{ border:1px solid #D6D6D6; border-radius:3px; float:left;line-height:40px; font-size:14px; font-weight:bold; text-transform:uppercase;}
.console_buttons button:hover{ background:#D6D6D6; border:1px solid #D6D6D6;}
		
.quick_access{ float:left; clear:both; padding:10px 0; width:100%;}
.quick_access button{ background:#EBEBEB;  border:1px solid #EBEBEB; margin:0 1% 0 0;  width:24.25%;} 
.quick_access button:last-child{ margin-right:0;}

.last_elections{ float:left; clear:both; /*border-top:1px dotted #D6D6D6; margin:10px 0 0;*/ padding:10px 0; width:100%;}
.last_elections button{ background:#FFF;  margin:0 1% 0 0;  width:9.1%;} 
.last_elections button:last-child{ margin-right:0;}

.console_buttons .bt_active{background:#BBB; border:1px solid #BBB;}
.console_buttons .bt_active:hover{ cursor:default; background:#BBB; border:1px solid #BBB;}

.disclaimer{ border-top:1px solid #EBEBEB; position:relative; width:100%; padding:20px 0; margin:10px 0; font-size:15px; color:#000; font-weight:300; line-height:140%; float:left; clear:both;}
.disclaimer:before{ border-top:5px solid #F9F9F9; position:absolute; top:0; left:0; content:''; width:100%;}

svg {position: relative;}
svg path {fill: #eaeaea; fill-opacity: 1; stroke: #fff; stroke-width: 1.25; stroke-miterlimit: 4; stroke-opacity: 1; stroke-dasharray: none; }
svg text {font-size: 15px; font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#333;fill-opacity:1;stroke:none;font-family:Trebuchet MS, Helvetica, sans-serif;-inkscape-font-specification:'Trebuchet MS, Helvetica, sans-serif'; cursor: pointer; pointer-events: none;}
.go_democratic {fill: #07f;}
.go_republican {fill: #e31347;}

.go_independent {fill: #800080;} 				/*1968*/
.bar_results.go_I, .bar_results.go_AI {background: #800080;}
.go_southern_republican {fill: #f00;} 			/*1948*/
.bar_results.go_SR {background: #f00;}
.go_progressive {fill: #28c928;} 				/*1924*/
.bar_results.go_PR {background: #28c928;}
.go_peoples {fill: #ace1af;} 					/*1892*/
.bar_results.go_PO {background: #ace1af;}
.go_socialist {fill: #f03;} 					/*1892*/
.bar_results.go_SP {background: #f03;}
.bar_results.go_R {background: #e31347;}

/* elections night styles */
.frontPage path.go_democratic, .frontPage rect.go_democratic, .frontPage circle.go_democratic {fill: #73B9FF;}
.frontPage path.go_democratic.calledState, .frontPage rect.go_democratic.calledState, .frontPage circle.go_democratic.calledState {fill: #07f;}
.frontPage path.go_republican, .frontPage rect.go_republican, .frontPage circle.go_republican {fill: #FF7578;}
.frontPage path.go_republican.calledState, .frontPage rect.go_republican.calledState, .frontPage circle.go_republican.calledState {fill: #e31347;}
.go_tie {fill: #cdcdcd;}
.go_other {fill: #d8a403;}
.bar_results.go_other {background: #28c928;}

.mapLegend { color: #333333; font-size: 12px; line-height: 14px; font-weight: 700; width: 100%; padding: 10px 10px 5px; overflow: hidden; }
.mapLegend p { float: left; color: #333333; font-size: 12px; line-height: 14px; font-weight: 700; margin-right: 10px; margin-bottom: 5px; min-width: 130px;}
#includeUSA .mapLegend { border-bottom: 1px solid #E2E2E2; }

.square{display: inline-block; width: 11px; height: 11px; margin-right: 3px;}
.square.go_democratic{background: #07f;}
.square.go_democratic.lightColor{background: #73B9FF;}
.square.go_republican{background: #e31347;}
.square.go_republican.lightColor{background: #FF7578;}
.square.go_tie{background: #CDCDCD;}
.square.go_neutral{background: #EAEAEA;}
.square.go_other{background: #d8a403;}
.bottomLine {background: #e2e2e2; clear:both; padding: 3px 10px; overflow: hidden; font-size: 13px;}
.fl {float: left; display:none;}
.fr {float: right;}

svg path:hover{ opacity:0.8} 

.graph_results .bar_results .republican_bar.progressive_votes {background-color: #28c928;} 	/*1912 - Roosevelt*/
.graph_results .republican_candidate.progressive_votes figure h2 {color: #28c928;} 			/*1912 - Roosevelt*/
.graph_results .republican_candidate.progressive_votes figure img {border-color: #28c928;} 	/*1912 - Roosevelt*/
.graph_results .democratic_candidate figure h2 a{color: #0077FF;}
.graph_results .republican_candidate figure h2 a{color: #E31347;}

text.go_democratic, text.go_republican, text.go_independent, text.go_southern_republican, text.go_progressive, text.go_peoples, text.go_socialist, text.go_other, text.go_tie {fill: #fff;}
text.go_democratic[data-css], text.go_republican[data-css], text.go_democratic.vote_1, text.go_republican.vote_1, text.go_democratic.vote_2, text.go_republican.vote_2 {fill: #333;}

#map_other {clear: both; position: absolute; font-size: 14px; width: 230px; background: #eaeaea; border-radius: 3px; padding: 8px; display: none; text-align: center; margin-left: -9px;}
#map_other:before {content: ''; display: block; width: 0px; height: 0px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #eaeaea; position: absolute; left: 50%; top: -7px; margin-left: -4px;}

.patterns rect {stroke-width: 0;}
.patterns rect:first-child {stroke-width: 14;}
.patterns .go_democratic {stroke: #07f;}
.patterns .go_republican {stroke: #e31347;}
.patterns .go_blank {stroke: #eaeaea;}

svg circle, svg rect {fill: #eaeaea; cursor: pointer;}
svg path, svg text, svg circle, svg rect, .graph_results .candidate figure, .graph_results .candidate figure h2, .bar_results {-webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out;}
#mapTooltip {display: none; position: absolute; background: #eaeaea; border-radius: 3px; margin: -85px 0 0 -75px; padding: 8px; min-width: 120px;
-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);}
#mapTooltip strong {display: block; border-bottom: 1px solid #fff;}
#mapTooltip span {font-weight: bold;}
#mapTooltip:after {content: ''; display: block; width: 0px; height: 0px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #eaeaea; position: absolute; left: 50%; top: 100%; margin-left: -4px;}

/* elections night tooltip styles */
#iframeTooltip {display: none; position: absolute; background: #fff; border-radius: 3px; margin: -165px 0 0 -35px; padding: 8px 12px 4px; min-width: 400px; font-size: 13px; z-index: 9999; box-shadow: 0px 0px 0px 4px rgba(0, 0, 0, 0.1); }
#iframeTooltip:after {content: ''; display: block; width: 0px; height: 0px; position: absolute; top: 100%; margin-left: 15px; border: .4em solid black; border-color: transparent transparent #FFF #FFF; transform-origin: 0 0; transform: rotate(-45deg); box-shadow: -2px 2px 0px 2px rgba(0, 0, 0, 0.1); }
#iframeTooltip.tooltipHeight { margin-top: -130px; }
#iframeTooltip.tooltipLeft { margin-left: -280px; }
#iframeTooltip.tooltipLeft:after { margin-left: 0; right: 15px; }

#includeUSA { font-family:'Benton Sans', Arial, Helvetica, sans-serif; }
#includeUSA #iframeTooltip { margin-top: -150px; }
#includeUSA #iframeTooltip.tooltipHeight { margin-top: -125px; }

.tooltipHeader {overflow: hidden; border-bottom: 1px dotted #333;}
.tooltipHeader > strong {float: left; font-size: 14px;}
.tooltipHeader span {float: right;}
.tooltipPercentage {border-top: 1px dotted #333; font-size: 12px;}
.tooltipCandidate {overflow: hidden; border-top: 1px dotted #eaeaea; font-size: 12px;}
.tooltipCandidate div {float: left; width: 10%; text-align: right; line-height: 26.4px;}
.tooltipCandidate div:first-child {width: 50%; text-align: left;}
.tooltipCandidate div:last-child {width: 40%;}
.frontPage#map_other {position: static; float: left; margin-left: 0; width: 380px; margin-bottom: 10px; }

.map_legend_cont{ display:block; margin:0 auto 10px; max-width:510px; }
.map_legend{ background:url(../img/ico_map_legend.png) 0 0 no-repeat; width:225px; margin:0 10px 0; font-size:14px; font-weight:200; color:#666; line-height:140%; padding:5px 0 5px 35px; float:left; }

.mapPlayer { cursor: pointer; float: left; display:block;}

.mapPlayer [class*="boton_"] {
    background: url(../img/flechas.png);
    float: left;
}
.mapPlayer .boton_cargando{text-indent:0;background-position:-48px -48px;}
.mapPlayer .boton_anterior:hover{/*background-position:0 -48px;*/background-position:1px -47px;}
.mapPlayer .boton_siguiente{background-position:-96px 0;}
.mapPlayer .boton_siguiente:hover{/*background-position:right -48px;*/ background-position:-96px -47px;}
.mapPlayer .boton_play{background-position:-193px -49px;border: 0.125rem solid #111;border-radius:100%;}
.mapPlayer .boton_cargando span{border-top: 0.125rem solid #016CA;border-right: 0.125rem solid #016CA2;border-bottom: 0.125rem solid rgba(100,100,100,.1);border-left: 0.125rem solid rgba(100,100,100,.1);
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
	-webkit-animation: boton_cargando 2s infinite linear;
	animation: boton_cargando 2s infinite linear;  
background:none;display:block;text-indent:-9999px;border-radius:100%;background:none;overflow:hidden;height:48px;width:48px;text-indent:-9999px;display:block;}
.mapPlayer .boton_repetir{background-position:-146px 46px;}
.mapPlayer .boton_repetir{border: 0.125rem solid #111;border-radius:100%;}
.mapPlayer p{    width: 225px;   margin: 0 20px; font-size: 14px;  font-weight: 200; color: #666;  line-height: 140%; padding: 5px 0 5px 35px;}

.year_cont{ margin:20px 0 0; clear:both; float:left; width:100%; }

.year_cont .apertura{}
.year_cont .apertura article{ float:left; width:calc(100% - 420px);}
.year_cont .apertura article h2{ font-size:30px; margin-bottom:10px; font-weight:bold; line-height:120%;}
.year_cont .apertura article p{ margin:0 0 10px;}
.year_cont .apertura article p.autor{ font-size:13px; color:#333;}
.year_cont .apertura article p.entradilla{ font-size:16px;}
.year_cont .apertura .foto-portada{ width:400px; float:right; margin-left:20px;}
.year_cont .apertura .foto-portada p{ line-height:40px; color:#FFF; background-color:#333; text-align:center; font-size:18px; font-weight:600; text-transform:uppercase; margin-bottom:10px;}
.year_cont .apertura .foto-portada img{ border:1px solid #F0F0F0;}


/* include de portada - noche electoral */
#includeUSA { margin: 0 auto 0; position: relative; max-width: 996px; background: white; padding: 0 11px; }
#includeUSA .cabeceraUSA { background: #03266c; border-top: 3px solid #E30F44; padding: 10px; }
#salida_portadilla #includeUSA .cabeceraUSA{ display:none;}
#includeUSA .cabeceraUSA .enlace-nombre { background: url('/especiales/2016/elecciones-eeuu/img/elecciones_eeuu.svg') no-repeat left center; width: 354px; height: 24px; display: inline-block; text-indent: -9999px; overflow: hidden; max-width: 100%; background-size: 95% auto; }
#includeUSA .cabeceraUSA .enlace-nombre-br { background-image: url('/especiales/2016/elecciones-eeuu/img/elecciones_eeuu_br.svg'); }
#includeUSA .cabeceraUSA .enlace-nombre-cat { background-image: url('/especiales/2016/elecciones-eeuu/img/elecciones_eeuu_cat.svg'); }
#includeUSA .cabeceraUSA .enlace-resultados { float: right; color: #fff; text-transform: uppercase; font-size: 12px; line-height: 24px; }
#includeUSA .graph_results { margin-bottom: -15px; border-bottom: 1px solid #e2e2e2; padding-bottom: 30px; }
#includeUSA #map_other { margin-top: -90px; width: 200px; font-size: 13px; position: relative; }
#includeUSA .graph_results figure strong { top: 80px; }
#includeUSA .bottomLine { margin-top: -25px; padding: 8px 10px; font-size: 12px; }
#includeUSA .bottomLine p { display: inline-block; margin-right: 8px; }
#includeUSA .bottomLine p .square { vertical-align: top; margin-top: 1px; }
#includeUSA .bottomLine p.latestUpdate { width: 39%;float: right; text-align: right; }
#includeUSA .bottomLine .votingWrapper { width: 50%; float: left; text-align: left; }
#includeUSA #iframeTooltip p {padding: 3px 0;}
#includeUSA .texts text {font-size: 1.1rem;}

#includeUSA #text_MA, #includeUSA #text_RI, #includeUSA #text_CT, #includeUSA #text_NJ, #includeUSA #text_DE, #includeUSA #text_MD, #includeUSA #text_DC, #includeUSA #text_NE1, #includeUSA #text_NE2, #includeUSA #text_ME1 {font-size: 0.9rem;} 
/* tooltip iframe */
#includeUSA #iframeTooltip {margin-top: -170px;}
#includeUSA #iframeTooltip.tooltipHeight {margin-top: -150px;}
#includeUSA #iframeTooltip.tooltipLeft {margin-left: -290px;}

p.processAlert { color: #111111; font-size: 16px; line-height: 120%; font-family: 'Benton Sans'; font-weight: 100; text-align: center; border-bottom: 1px solid #EBEBEB; padding: 15px; position: relative; }
.salida_carcasa p.processAlert { margin-top: -20px; } 
p.processAlert:before { content: ''; display: inline-block; width: 29px; height: 27px; background: url('/especiales/2016/elecciones-eeuu/img/urna.png') no-repeat center; margin-right: 15px; vertical-align: middle; }
p.processAlert:after { border-bottom: 5px solid #F9F9F9; display: block; width: 100%; content: ''; position: absolute; bottom: -6px; left: 0; margin-bottom: 6px; }

@-webkit-keyframes boton_cargando {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes boton_cargando {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@media(max-width:999px){
	.year_cont .apertura article{ float:left; width:calc(100% - 320px);}
	.year_cont .apertura .foto-portada{ width:300px;}
	
}
@media(max-width:767px){
	.quick_access button{ background:#EBEBEB;  border:1px solid #EBEBEB; margin:0 1% 1% 0;  width:49.5%;} 
	.quick_access button:last-child, .quick_access button:nth-child(3){ margin-right:0;}
	
	.last_elections button{  margin:0 1% 1% 0; width:19.2%;} 
	.last_elections button:last-child, .last_elections button:nth-child(6), .last_elections button:nth-child(11){ margin-right:0;}
	svg { height: auto; }
	
	.year_cont .apertura article{ float:none; width:100%;}
	.year_cont .apertura article img{ width:100%;}
	.year_cont .apertura .foto-portada{ float:none; width:100%; text-align:center; margin:0;}
	.year_cont .apertura .foto-portada img{ border:1px solid #F0F0F0; margin:0 auto;}
}
  	
@media (min-width: 600px) and (max-width: 768px){
  	#includeUSA .map_results { height: 360px; }
}

@media(max-width:767px){
	h2.map_year{ padding-bottom:10px; text-align:center; width:100%;}
	.select_year_cont{ float:none; clear:both; margin:10px auto; width:200px; }
	
	.graph_results{ margin:40px 0 40px;}
	.graph_results_inner{position:relative; padding:20px 60px;}
	.graph_results .candidate figure img{ width:70px;}
	
	.graph_results .bar_results { height: 30px;}
	.graph_results .bar_results .democratic_bar{ height:30px; }
	.graph_results .bar_results .republican_bar{ height:30px;}
	.graph_results .bar_results .votes_number{ font-size:18px; line-height:30px; padding:0 15px;}
	.graph_results .candidate figure h2{ font-size:12px; text-transform:uppercase; top:-25px}
	.graph_results .democratic_candidate figure h2{ left:0;}
  .graph_results .republican_candidate figure h2{ right:0;}

	.graph_results .bar_results:before { height: 40px;}
	.graph_results .majority{ height: 80px; top: 60px; }
	
	.console_buttons p{font-size:12px;}
	.console_buttons button{ font-size:12px;}
	
	#map_other{ /*max-width:170px;*/font-weight:bold; font-size:12px; padding:2px; line-height:110%;}
	.map_legend_cont{ max-width:225px;}
	.map_legend{ margin-top:20px;}
	
	.year_cont .apertura article h2{ font-size:30px; }
  
  .graph_results .democratic_candidate figure strong, .graph_results .republican_candidate figure strong { left: 0; top: 75px; max-width: 85px; font-size: 12px; line-height: 100%; white-space: normal; }
  .graph_results .republican_candidate figure strong { right: 0; left: auto; }
  .frontPage#map_other { width: auto; padding: 5px; line-height: 140%; }
  #includeUSA .graph_results { padding-left: 5px; padding-right: 5px; float: none; border-bottom: none; }
  #includeUSA #map_other { margin-top: 0; margin-bottom: 5px; width: 100%; float: none; max-width: 100%; border-radius: 0; }
  #includeUSA .map_results { margin: 30px 0; height: 160px; }
  #includeUSA .bottomLine { margin-top: 0; }
  #includeUSA .bottomLine p.latestUpdate { width: 105%; float: none; text-align: right; margin: 10px -10px 0; padding: 5px 2.5% 5px; background: #e2e2e2; }
  #includeUSA .cabeceraUSA .enlace-resultados { float: none; display: block; margin: 0px 3px 0; }
  #includeUSA .cabeceraUSA .enlace-nombre { background-position: 0 0; }
  #includeUSA .bottomLine .votingWrapper { width: auto; }
  #includeUSA #iframeTooltip { left: 50% !important; margin-left: -150px !important; }
  #includeUSA #iframeTooltip:after { content: none; }
  
  p.processAlert { font-size: 12px; }
}

@media (min-width: 360px) and (max-width: 480px){
  	#includeUSA .map_results { height: 120px; }
}

@media(max-width: 380px) {
  	#includeUSA .map_results { height: 100px; }
}

.cabecera-superior .articulo-actualizado { font-size: 1em; }

/* CERRAR */
#mapa_principal{width: 100%;height: auto;}
#tooltipCandidateClose{
position: absolute;
    top: -9px;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-indent: -99999px;
    display: none;
    background: rgba(0, 0, 0, 0.7);
    right: -9px;
    border-radius: 100%;border: 1px solid olive;z-index: 1;}
#tooltipCandidateClose:before{content: 'x';display: block;color: #fff;font-size: 14px;line-height: 14px;width: 18px;position: absolute;top: 0;left: -1px;text-align: center;z-index:5;
text-indent: 0;}

/* AJUSTE IE 11*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
  .map_results{width: 100%;}
  #mapa_principal{ width:980px;height: 680px;}
}

@media(max-width: 999px){
  #tooltipCandidateClose{display:block; }
}