@font-face {
    font-family: 'Majerit';
    src: url('/fonts/v2.x/v2.0/majerit/majeritdeck-roman-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Majerit';
    src: url('/fonts/v2.x/v2.0/majerit/majeritheadlinemedium-roman-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;

}

@font-face {
    font-family: 'Majerit';
    src: url('/fonts/v2.x/v2.0/majerit/majeritheadlinecondensedbold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;

}

@font-face {
    font-family: 'Majerit';
    src: url('/fonts/v2.x/v2.0/majerit/majerittext-bolditalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;

}

/* BENTON */
@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-regularitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-medium-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;

}

@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;

}

@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-bolditalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;

}

@font-face {
    font-family: 'Benton Sans';
    src: url('/fonts/v2.x/v2.0/benton/bentonsans-black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;

}

#sin_columnas .columnas_principal_y_secundaria {  width: 960px;}
.columnas_principal_y_secundaria { padding: 0 20px;}
.header .seccion { display:none;}

li, ul, ol{list-style: none;}
img{display: inline-block; max-width: 100%; height: auto;}

/*generales*/
.contenido_especial{font-family: 'Benton Sans'; font-weight: 400; padding: 5px 0; color: #2F2F2F;}
.col6{width: 50%; float: left;}

#sin_columnas .columnas_principal_y_secundaria {  width: 980px; padding-top: 0;}
.columnas_principal_y_secundaria { padding: 0 10px;}
.division_columnas { background:none;}
.columna_principal { width:100%; padding:0;}

.encabezado-electoral{ border-bottom:1px solid #EBEBEB; position:relative; margin-bottom:20px;}
.encabezado-electoral:before{ border-bottom:5px solid #F9F9F9; display:block; width:100%; content:''; position:absolute; bottom:-6px; left:0;}
.encabezado-electoral h1{ font-size:34px; color:#333333; text-align:center; margin:30px auto 15px; line-height: 35px; max-width: 630px; width: 100%; }
.encabezado-electoral p{ font:200 14px/21px 'Benton Sans', sans-serif; color:#333333; text-align:center; padding:0 50px; max-width: 630px; width: 100%; margin: 0 auto;}
.encabezado-electoral .mod_compartir{ margin:0 auto;}
.encabezado-electoral .barra_compartir{ padding:0; width:111px; height:31px; margin:15px auto 30px; float:none;}
.encabezado-electoral ul.list-compartir li{float:left; margin:0px 3px; list-style:none; }
.encabezado-electoral ul.list-compartir li a{ display:block; height:31px; width:31px; text-indent:-99999em;}
.encabezado-electoral ul.list-compartir li a:hover{ opacity:0.8}
.encabezado-electoral ul.list-compartir li a.facebook{background:url(../img/sprite-twitter.png) 0 0 no-repeat;}
.encabezado-electoral ul.list-compartir li a.twitter{ background:url(../img/sprite-twitter.png) -37px 0 no-repeat;}
.encabezado-electoral ul.list-compartir li a.googlemas1{ background:url(../img/sprite-twitter.png) -74px 0 no-repeat;}

.calendario{ background:url(../img/fondo-calendario.png) left top repeat-y; padding:10px 0;}
.item_calendario{ background:url(../img/item_calendario_neutro.png) left top no-repeat; margin-bottom:60px; padding:3px 0 0 110px;}
.item_calendario.democrata{ background:url(../img/item_calendario_azul.png) left top no-repeat;}
.item_calendario.republicano{ background:url(../img/item_calendario_rojo.png) left top no-repeat;}
.calendario .fecha{ color:#777777; font:700 14px/18px 'Benton Sans', sans-serif; margin-bottom:5px; background:#FFF;}
.calendario h4{ font:700 16px/22px 'Benton Sans', sans-serif; margin-bottom:5px;}
.calendario .descripcion_evento{ font:200 15px/20px 'Benton Sans', sans-serif;}
.calendario .descripcion_evento.nota_pie{ font:500 13px/20px 'Benton Sans', sans-serif;}
.tabla_primarias{ margin:30px 0;}
.tabla_primarias table{border-bottom:1px solid #EAEAEA;}
.tabla_primarias table thead{ border-top:1px solid #EAEAEA;}
.tabla_primarias table thead td{ background:#F6F6F6; font:700 14px/20px 'Benton Sans', sans-serif; padding:10px 0; }
.tabla_primarias table thead td.fecha{line-height:20px; padding-left:5px; background:#F6F6F6; color:#000}
.tabla_primarias table thead td.democrata{ color:#007FFF;}
.tabla_primarias table thead td.republicano{ color:#E31045;}
.tabla_primarias table tbody{}
.tabla_primarias table tbody td{ background:#FFF; font:300 13px/20px 'Benton Sans', sans-serif; padding:10px 10px 10px 0 ; border-top:1px solid #EAEAEA;}
.tabla_primarias table tbody td.fecha{ line-height:20px;padding-left:5px;}
.tabla_primarias table tbody td.observaciones{ line-height:20px; border-top:1px dotted #EAEAEA; padding:5px; color:#666}
.tabla_primarias table tbody td.partido{ padding:10px 0 0; line-height:15px; }
.tabla_primarias table tbody td .bullet{ border-radius:100%; width:15px; height:15px; background-color:#CCC; text-indent:-99999em; display:inline-block; margin:0px 5px 5px;} 
.tabla_primarias table tbody td .bullet.democrata{ background-color:#007FFF;}
.tabla_primarias table tbody td .bullet.republicano{ background-color:#E31045;}

.calendario .graficos_resultados{ margin:30px 0;}
.calendario .graficos_resultados .grafico-democrata{ width:48%; float:left;}
.calendario .graficos_resultados .grafico-republicano{ width:48%; float:right;}

.sondeos{}
.sondeos h2{ font-size:26px; margin:10px 0}
.sondeos h3{ font:700 14px/20px 'Benton Sans', sans-serif; text-transform:uppercase; margin:0 0 10px 0;}
.sondeos h3.democrata{ color:#007FFF;}
.sondeos h3.republicano{ color:#E31045;}
.sondeos .sondeos--ultimo{border-bottom:1px solid #EBEBEB; position:relative; margin-bottom:40px;}
.sondeos .sondeos--ultimo:before{ border-bottom:5px solid #F9F9F9; display:block; width:100%; content:''; position:absolute; bottom:-6px; left:0;}
.sondeos .sondeos--grafico{ margin-bottom:20px}
.linea-puntos{ border-bottom:1px dotted #B2B2B2; padding-bottom:20px;}

.candidatos{}
#candidatos-rejilla{ margin:20px 0;}
#candidatos-rejilla .mix{ display: none; background:#FFF; width:31%; margin:1%; text-align:center; position:relative; min-width:300px;}
#candidatos-rejilla .retired{ color:#FFF;}

.candidatos .filtros{ width:100%; margin-bottom:20px;}
.candidatos .filter{ width:20%; display:inline-block; background:#F0F0F0; padding:0; margin:0; text-align:center; font:700 13px/36px 'Benton Sans', sans-serif; color:#333; text-transform:uppercase; float:left; position:relative;}
.candidatos .filter:before{ border:1px solid #FFF; position:absolute; top:0; left:0; height:36px; content:'';}
.candidatos .filter:first-child:before{ border:none;}
.candidatos .filter:hover{ cursor:pointer; background:#CCC;}
.candidatos .filter.active{ background:#042C6C; color:#FFF;}
.candidatos .filter.active:after{width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid #042C6C; position:absolute; bottom:-8px; left:50%; content:''; margin-left:-8px;}
.candidatos .filter.active:hover{ cursor:auto;}

.candidatos .abandonos_previos{}
.candidatos .abandonos_previos h3{font:700 18px/26px 'Benton Sans', sans-serif; color:#333; margin:10px;}
.candidatos .abandonos_previos p{font:200 14px/20px 'Benton Sans', sans-serif; color:#111; margin:10px;}

/* =============================================================================

/**
 * The cards
 *
 * Each card plays home to a front and back. I've set them up as squares here
 * by using the padding technique, but you may set them up in any dimensions
 * you like based on your site design.
 */
.card {
  position: relative;
  float: left;
  width: 100%;
  text-align: center;
  min-height:470px;
}

.card:hover { cursor:pointer;}

/* card fronts and backs */
.card__front,
.card__back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.card__front,
.card__back {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.5s;
          transition: transform 0.5s;
}

.card__front {
  background-color: #F0F0F0;
}

.card__back {
  background-color: #F0F0F0;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card figure{ margin-top:20px; position:relative;}
.card figure img{ border-radius:100%; border:3px solid #000; padding:2px; }
.democrata .card figure img{ border-color:#007FFF;}
.republicano .card figure img{ border-color:#E31045;}
.card figure h2{font:700 18px/20px 'Benton Sans', sans-serif; color:#333; margin:5px 0;}
.card figure h3{font:700 12px/16px 'Benton Sans', sans-serif; text-transform:uppercase; color:#333;}
.democrata .card figure h3{color:#007FFF;}
.republicano .card figure h3{color:#E31045;}
.card .descripcion_breve{ border-top:1px solid #FFF; margin:15px 0 0; padding:20px 10px; font:200 14px/22px 'Benton Sans', sans-serif; color:#111; }
.card .card__front:after,  .card .card__back:after{ position:absolute; top:0; right:0; width:30px; font:700 30px/30px 'Benton Sans', sans-serif; text-align:center; color:#000; display:block; content:'+'; color:#FFF; z-index:0}
.card .card__front:before, .card .card__back:before{position:absolute; top:0; right:0; width: 0; height: 0; border-top: 50px solid #3f3f4b; border-left: 50px solid transparent; content:''; z-index:0}
.democrata .card__front:before, .democrata .card__back:before{border-top: 50px solid #007FFF;}
.republicano .card__front:before, .republicano .card__back:before{border-top: 50px solid #E31045;}

.retired .card__back,.retired .card__front { background-color:#C8C8C8;}
.retired .card figure:before{ position:absolute; top:110px; left:50%; margin-left:-72px; content:'Retirado'; font:700 12px/28px 'Benton Sans', sans-serif; text-transform:uppercase; color:#F0F0F0; background-color:#333; width:155px; text-align:center; -webkit-transform: rotate(-10deg); transform: rotate(-10deg);}
.retired .card .card__back figure:before{ display:none;}
.retired .card figure h3{color:#F0F0F0;}
.retired .card .descripcion_breve{color:#F0F0F0;}
.retired .card .card__back .descripcion_larga{color:#F0F0F0;}


.card .card__back figure{ margin:10px; position:relative; text-align:center;}
.card .card__back figure img{width:80px; margin-right:10px; }
.card .card__back figure figcaption{ padding-top:2px;}
.card .card__back figure .enlaces{ font:500 12px/18px 'Benton Sans', sans-serif;}
.democrata .card .card__back figure .enlaces a{ color:#007FFF;}
.republicano .card .card__back figure .enlaces a{color:#E31045;}
.card .card__back figure .enlaces a:hover{ color:#999;}
.card .card__back h3 {font:700 12px/16px 'Benton Sans', sans-serif; text-transform:uppercase; color:#FFF; background-color:#000; padding:10px; margin: 0 24px;}
.card .card__back .descripcion_larga{ margin:10px 0; padding:10px 15px; font:200 15px/20px 'Benton Sans', sans-serif; color:#111; text-align:center; clear:both; }
.card .card__back:after{ content:'-';}

/* card text */
.card__text {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  height: 20px;
  color: #333;
  font-family: "Roboto Slab", serif;
  line-height: 20px;
}

/* hover effect */
.card.effect__hover:hover .card__front {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__hover:hover .card__back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}

/* click effect */
.card.effect__click.flipped .card__front {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__click.flipped .card__back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}

/* random effect */
.card.effect__random.flipped .card__front {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__random.flipped .card__back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}

.col2{ margin-bottom:40px; clear:both;}
.col{ width:48%; float:left;}
.col.dere{ margin-left:4%;}

.grafico-pq{border-bottom:1px solid #EBEBEB; position:relative; margin-bottom:20px; padding-bottom:20px; position:relative;}
.grafico-pq:before{ border-bottom:5px solid #F9F9F9; display:block; width:100%; content:''; position:absolute; bottom:-6px; left:0;}

.grafico-pq.candidato { padding-top:35px;}
.grafico-pq.candidato figure{ top:0; left:0; position:absolute; width:100%; padding-top:65px; margin:0;}
.grafico-pq.candidato figure img{ border-radius:100%; border:3px solid #CCC; padding:2px; width:94px; height:94px; background:#FFF; position:absolute; top:0; right:0;} 
.grafico-pq.candidato.democrata  figure img{ border-color:#007FFF;}
.grafico-pq.candidato.republicano figure img{ border-color:#E31045;}
.grafico-pq.candidato figure h2{font:700 18px/20px 'Benton Sans', sans-serif; color:#333; padding:30px 0 5px; }
.grafico-pq.candidato.democrata  figure{border-bottom:2px solid #007FFF;}
.grafico-pq.candidato.republicano figure{border-bottom:2px solid #E31045;}


.creditos{width:auto;padding:40px 20px 50px; clear:both;  text-align:center; border-top:1px dotted #CCC;}
.creditos a {color:#333; text-decoration: underline;}
.creditos p {padding: 0 0 10px 0; margin: 0px;  color: #111; font:200 12px/20px 'Benton Sans', sans-serif; c}
.creditos h5{ margin-bottom: 20px; font:700 18px/20px 'Benton Sans', sans-serif; }

@media (max-width:999px) {   
    /*responsive */
	.contenido_principal { padding:0 10px}
    .contenedor_centro {margin-left: 0;display:none;} 
    .contenedor_principal {width: 100%; box-sizing: border-box;border:none; }
    .columnas_principal_y_secundaria {width:100%; box-sizing: border-box; padding:0;}
    #pie {display: none;} 
    #sin_columnas .columnas_principal_y_secundaria {width:100%;box-sizing: border-box;}
	
	/****/
	.item_calendario{  padding:3px 0 0 60px;}
	
	#candidatos-rejilla .mix{ width:47%; min-width:200px;}
}
@media(max-width:699px){
	.card { min-height:450px;}
	.candidatos .filter{ font:500 12px/36px 'Benton Sans', sans-serif;}
	.col{ width:100%; float:left;}
	.col.dere{ margin-left:0%;}
	.grafico-pq{margin-bottom:40px;}
	.calendario .graficos_resultados .grafico-democrata{ width:100%; float:left;}
	.calendario .graficos_resultados .grafico-republicano{ width:100%; margin-top:20px;}	
}
@media(max-width:599px){
	.contenedor_izquierda{ display:none;}
	.contenido_especial .encabezado h1{font-size: 30px; width: 100%; display: inline-block; text-align: left;}
	.contenido_especial .encabezado p{text-align: left;margin: 10px 0 20px 0; }
	.contenido_especial .encabezado {  margin: 0; padding-bottom: 20px;}
	
	/****/
	.item_calendario{  padding:3px 0 0 40px;}
	.tabla_primarias table thead td, .tabla_primarias table thead td.fecha{ font:700 12px/18px 'Benton Sans', sans-serif;}
	.tabla_primarias table tbody td, .tabla_primarias table tbody td.fecha{ font:300 12px/18px 'Benton Sans', sans-serif; padding:10px 5px 10px 0;}
	.tabla_primarias table tbody td.fecha{ width:100%; display:block;}
	.tabla_primarias table tbody td .bullet{ margin:0px 5px 5px;} 
	
	#candidatos-rejilla .mix{ width:98%;}
	.candidatos .filter{ font:500 11px/36px 'Benton Sans', sans-serif; width:31%; display:inline-block; margin:1%;}
	.candidatos .filter.active:after{ display:none;}
	
	#grafico-financiacion{ display:none;}
}

@media(max-width:400px){
	.contenedor_derecha .usuario .boton_favoritos { display:none;}
	.contenido_especial .encabezado h1{font-size: 28px;}
	.contenido_especial .encabezado p{ font-size:15px; }
	.candidatos .filter{width:48%; display:inline-block; margin:1%;}
	
}