/* COLORES: gris fuente: 87868a pp: #2a91d5 psoe: #e32d42 ciudadanos: #eb6615 podemos: #641766 iu: #2e613d */ body {position: relative; width: 990px; margin:auto; height:650px; /*border: 1px solid lightgrey;*/} 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;} .fl{float:left;} .fr{float:right;} .oculto{display:none !important;} .anteriorLeg{opacity:0.72 !important;} span.color_p, span.txt_p{display:inline-block;height:15px;float:left;} span.seats_p{display:inline-block;height:15px;float:right;} span.color_p{width:6px; margin-right:5px;} 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;} /* COLORES */ .pp .color_p, .seats_coalic .seats_party.pp{background-color:#2a91d5;} .psoe .color_p, .seats_coalic .seats_party.psoe{background-color:#e32d42;} .cs .color_p , .seats_coalic .seats_party.cs{background-color:#eb6615;} .pod .color_p , .seats_coalic .seats_party.pod{background-color:#641766;} .iu .color_p , .seats_coalic .seats_party.iu{background-color:#2e613d;} .cdc .color_p , .seats_coalic .seats_party.cdc{background-color:#124162;} .erc .color_p , .seats_coalic .seats_party.erc{background-color:#F79F21;} .pnv .color_p , .seats_coalic .seats_party.pnv{background-color:#009526;} .bildu .color_p , .seats_coalic .seats_party.bildu{background-color:#C3CF34;} .cmp .color_p , .seats_coalic .seats_party.cmp{background-color:#626231;} .bng .color_p , .seats_coalic .seats_party.bng{background-color:#9CC1E6;} .cc .color_p , .seats_coalic .seats_party.cc{background-color:#FFFF96;} .otros .color_p , .seats_coalic .seats_party.otros{background-color:#AEADB3;} .upyd .color_p , .seats_coalic .seats_party.upyd{background-color:#E20183;} .fac .color_p , .seats_coalic .seats_party.fac{background-color:#003784;} .gbai .color_p , .seats_coalic .seats_party.gbai{background-color:#E68272;} .ciu .color_p , .seats_coalic .seats_party.ciu{background-color:#001D59;} .cmp .color_p , .seats_coalic .seats_party.cmp{background-color:#626231;} #hemiciclo svg path.pp, #party_buttons div.buttCheck.activo.pp span.checkCont svg path{fill:#2a91d5;} #hemiciclo svg path.psoe, #party_buttons div.buttCheck.activo.psoe span.checkCont svg path{fill:#e32d42;} #hemiciclo svg path.cs, #party_buttons div.buttCheck.activo.cs span.checkCont svg path{fill:#eb6615;} #hemiciclo svg path.pod, #party_buttons div.buttCheck.activo.pod span.checkCont svg path{fill:#641766;} #hemiciclo svg path.iu, #party_buttons div.buttCheck.activo.iu span.checkCont svg path{fill:#2e613d;} #hemiciclo svg path.cdc, #party_buttons div.buttCheck.activo.cdc span.checkCont svg path{fill:#124162;} #hemiciclo svg path.erc, #party_buttons div.buttCheck.activo.erc span.checkCont svg path{fill:#F79F21;} #hemiciclo svg path.pnv, #party_buttons div.buttCheck.activo.pnv span.checkCont svg path{fill:#009526;} #hemiciclo svg path.bildu, #party_buttons div.buttCheck.activo.bildu span.checkCont svg path{fill:#C3CF34;} #hemiciclo svg path.cmp, #party_buttons div.buttCheck.activo.cmp span.checkCont svg path{fill:#626231;} #hemiciclo svg path.bng, #party_buttons div.buttCheck.activo.bng span.checkCont svg path{fill:#9CC1E6;} #hemiciclo svg path.cc, #party_buttons div.buttCheck.activo.cc span.checkCont svg path{fill:#FFFF96;} #hemiciclo svg path.gbai, #party_buttons div.buttCheck.activo.gbai span.checkCont svg path{fill:#E68272;} #hemiciclo svg path.otros, #party_buttons div.buttCheck.activo.otros span.checkCont svg path{fill:#AEADB3;} #hemiciclo svg path.upyd{fill:#E20183;} #hemiciclo svg path.fac{fill:#003784;} #hemiciclo svg path.ciu{fill:#001D59;} #hemiciclo svg path.cmp{fill:#626231;} #container{ width:990px; margin:5px auto; height:600px; background-color:white; font-size:15px; color:#1a1a1a; position:relative; opacity:0; } /* LOADING*/ #pre{position:absolute; width:100%; top:150px; text-align:center;} /* CABECERA*/ #cabecera{ width:100%; position:relative; height:27px; margin: auto; padding-top:10px; padding-bottom:10px;} #cabecera #titulo{display:inline-block; width:650px; float:left; line-height:30px; margin-left:15px;} #cabecera #titulo span{font-size:17px; line-height:36px;margin-right:12px;} #cabecera #cambioEncuesta{ display:inline-block; float:right; width:284px; padding:4px; margin-right:15px; border: 1px solid lightgrey !important; background-color:white; font-family:'Helvetica, Arial'; font-size:15px; } #mala_sombrica{width:100%; height:10px; background-image:url('https://e00-elmundo.uecdn.es/elmundo/2016/datos/jun/s5/26j/piedeurna/polls_seats/css/sombra_horizontal.png');} #dataviz{width:100%; height:500px; position:relative;} /* DATA CONTAINER*/ #data_container{float:left; width:49%; height:100%;} #data_container #hemiciclo{ width:85%; margin:auto; margin-top:0px; height: 230px; } #data_container #hemiciclo svg.svgEncuesta{width:420px; height:210px;padding:20px; margin-left:-20px;} #data_container #hemiciclo svg.svgXLegis{position:absolute; top: 86px; left: 109px;} .tabletNot #data_container.hoveredParty #hemiciclo svg.svgEncuesta path.ppath, .tabletNot #data_container.hoveredParty #hemiciclo svg.svgXLegis path.ppath, .tabletNot #data_container.hoveredParty #tablas_datos .party_res{ cursor:pointer; } .tabletNot #data_container.hoveredParty #hemiciclo svg.svgEncuesta path.ppath:not(.hovered), .tabletNot #data_container.hoveredParty #hemiciclo svg.svgXLegis path.ppath:not(.hovered), .tabletNot #data_container.hoveredParty #tablas_datos .party_res:not(.hovered), .tabletNot #data_container.hoveredParty #hemiciclo svg .helpElem{ opacity:0.1; } .tabletNot #data_container #hemiciclo svg .anteriorLeg, .tabletNot #data_container #tablas_datos #tdatos_ant, .tabletNot #data_container #hemiciclo svg .helpElem{ -webkit-transition: opacity 400ms linear; -moz-transition: opacity 400ms linear; -o-transition: opacity 400ms linear; -ms-transition: opacity 400ms linear; transition: opacity 400ms linear; } /*.tabletNot #data_container.hoveredParty #hemiciclo svg .anteriorLeg, .tabletNot #data_container.hoveredParty #tablas_datos #tdatos_ant{ opacity:1 !important; }*/ #hemiciclo svg path.ppath{stroke-width:1px; stroke:white;} .tabletNot #hemiciclo svg path.ppath, .tabletNot #tablas_datos .party_res:not(.hovered){ -webkit-transition: opacity 400ms linear; -moz-transition: opacity 400ms linear; -o-transition: opacity 400ms linear; -ms-transition: opacity 400ms linear; transition: opacity 400ms linear; } #hemiciclo svg .helpElem{font-size:11px; pointer-events:none;} #hemiciclo svg .textoSondeo{fill:white;} #hemiciclo svg .texto2011, #hemiciclo svg .textoMayoriaSvg tspan{fill:#87868a;} #hemiciclo svg .lineMayoriaSvg{ fill:lightgrey; width:1px; } #data_container #tablas_datos{width:85%; margin:auto; margin-top:15px;height: 322px;} #data_container #tablas_datos .tdatos{width:42%; height:270px;} #data_container #tablas_datos .tdatos#tdatos_enc{float:left;} #data_container #tablas_datos .tdatos#tdatos_ant{float:right;} .tdatos h2, .tdatos ul, .tdatos li{display:block; width:100%; height:20px;} .tdatos h2{font-size:15px; border-bottom:1px solid lightgrey;} .tdatos h2 span{display:inline-block;} .tdatos h2 span.tipo_tabla{float:left;} .tdatos h2 span.tabla_seats_txt{float:right;} .tdatos ul{margin-top:5px;} .tdatos .party_res{height:21px;} .tdatos .party_res span{font-size:13px; height:13px;} .tdatos .party_res span.color_p{width:5px;} /* GAME CONTAINER*/ #game_container{float:right; width:49%; height:100%; position:relative;} #game_container #horquillaHelp{ position:absolute; right:0px; top:0px; font-size:12px;} #game_container #seat_bars{ width:95%; margin:auto; height: 222px;} #game_container #seat_bars .seat_bar{ width:100%; height:110px; margin-top:30px; position:relative;} #seat_bars .seat_bar div.tancho{width:100%;} #seat_bars .seat_bar .info_coalic{height:40px;} #seat_bars .seat_bar .info_coalic div{display:inline-block;float:left; height:50px;} #seat_bars .seat_bar .info_coalic .num_seats{width:78px; border-right:1px solid lightgrey;} #seat_bars .seat_bar .info_coalic .num_seats span{float:left; display:inline-block;/*width:66px; border-right:1px solid lightgrey; padding-right: 12px;*/ font-size:40px;} #seat_bars .seat_bar .info_coalic .num_seats span.asterisco{display:inline-block;width:9px; font-size:20px; line-height:25px; } #seat_bars .seat_bar .info_coalic .txt_seats{margin-left:12px;} #seat_bars .seat_bar .info_coalic .txt_seats span{display:block;font-size:15px; line-height:21px; } #seat_bars .seat_bar .info_coalic .txt_seats span.coalic_name{max-width:340px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #seat_bars .seat_bar .seats_coalic{background-color:#f7f7f8; margin-top:10px; height:33px;} #seat_bars .seat_bar .seats_coalic .seats_party{height:100%;float:left;width:0px; border-right:0px solid white; -webkit-transition: width 400ms linear; -moz-transition: width 400ms linear; -o-transition: width 400ms linear; -ms-transition: width 400ms linear; transition: width 400ms linear; } #seat_bars .seat_bar .mayoria{position:absolute; text-align:center;} #seat_bars .seat_bar .mayoria.mayoria_barra{top:45px;} #seat_bars .seat_bar .mayoria.mayoria_barra div{height:44px; width:1px; background-color:lightgrey; margin:auto;} #seat_bars .seat_bar .mayoria.mayoria_txt{ top:90px;} #seat_bars .seat_bar .mayoria.mayoria_txt span{font-size:12px;} #seat_bars .seat_bar .mayoria.mayoria_txt svg{position:absolute; left:55.5%; width:15px; height:15px;} #seat_bars .seat_bar .mayoria.mayoria_barra.yesh div, #seat_bars .seat_bar .mayoria.mayoria_txt.yesh span, #seat_bars .seat_bar .mayoria.mayoria_txt.yeh svg path{ -webkit-transition: all 400ms linear; -moz-transition: all 400ms linear; -o-transition: all 400ms linear; -ms-transition: all 400ms linear; transition: all 400ms linear; } /*#seat_bars .seat_bar .mayoria.mayoria_barra.yesh div{background-color:#238C23;}*/ #seat_bars .seat_bar .mayoria.mayoria_txt.yesh span{color:#238C23;} #seat_bars .seat_bar .mayoria.mayoria_txt.yesh svg path{fill:#238C23;} #game_container #seat_bars .seat_bar.anteriorLeg {height:80px; margin-top:15px;} #game_container #seat_bars .seat_bar.anteriorLeg .info_coalic{height:40px;} #game_container #seat_bars .seat_bar .info_coalic div{display:inline-block;float:left; height:40px;} #game_container #seat_bars .seat_bar.anteriorLeg .seats_coalic {height:24px;} #seat_bars .seat_bar.anteriorLeg .mayoria.mayoria_barra div{height:34px;} #seat_bars .seat_bar.anteriorLeg .mayoria.mayoria_txt{top:78px;} #info_click{ width:95%; margin:auto; margin-top:20px; margin-bottom:15px; height:20px;} #info_click p{display:block; float:left; font-size:15px; font-weight:bold; color:#333;} #info_click div#reiniciarCoalic{float:right; display:none; cursor:default;} #info_click div#reiniciarCoalic button{ height:28px; line-height:24px; border:1px solid lightgrey; border-radius:3px; margin-top:-15px; cursor:pointer; background-color:white; padding-left:0px; padding-right:5px;} #info_click div#reiniciarCoalic button span{display:block; float:left;} #info_click div#reiniciarCoalic button span svg{width:24px; height:24px;} #party_buttons{ width:95%; clear:both; margin:auto; margin-top:20px; height:250px;} #party_buttons div:not(#reiniciarCoalic){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_buttons div.buttCheck{ width:190px; padding:5px; border:1px solid lightgrey; border-radius:3px; margin-bottom:7px;} #party_buttons div.buttCheck.sinmr{margin-right:0px;} #party_buttons div.buttCheck.deshabilitado{cursor:default !important; opacity:0.27;} #party_buttons div.buttCheck span.txt_p{margin-right:10px;} #party_buttons div.buttCheck span.checkCont{ display:inline-block; float:right; width:15px; height:15px; border: 1px solid lightgrey; border-radius:3px;} #party_buttons div.buttCheck span.checkCont svg path{ -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_buttons div.buttCheck.activo span.checkCont svg path{fill:#87868a;} #party_buttons div.buttCheck.activo.pp span.checkCont svg path{fill:#2a91d5;} #party_buttons div.buttCheck.activo.psoe span.checkCont svg path{fill:#e32d42;} #party_buttons div.buttCheck.activo.cs span.checkCont svg path{fill:#eb6615;} #party_buttons div.buttCheck.activo.pod span.checkCont svg path{fill:#641766;} #party_buttons div.buttCheck.activo.iu span.checkCont svg path{fill:#2e613d;} #party_buttons div.buttCheck.activo.cdc span.checkCont svg path{fill:#124162;} #party_buttons div.buttCheck.activo.erc span.checkCont svg path{fill:#F79F21;} #party_buttons div.buttCheck.activo.pnv span.checkCont svg path{fill:#009526;} #party_buttons div.buttCheck.activo.bildu span.checkCont svg path{fill:#626231;} #party_buttons div.buttCheck.activo.cmp span.checkCont svg path{fill:#B4CDCD;} #party_buttons div.buttCheck.activo.bng span.checkCont svg path{fill: #9CC1E6;} #party_buttons div.buttCheck.activo.cc span.checkCont svg path{fill:#FFFF96;} #party_buttons div.buttCheck.activo.otros span.checkCont svg path{fill:#AEADB3;} #party_buttons div.inactivo{opacity:0.3;} #party_buttons div#reiniciarCoalic{clear:both;margin:auto;text-align:center; display:none;padding-top:10px; cursor:default;} #party_buttons div#reiniciarCoalic button{ height:30px; line-height:24px; border:1px solid lightgrey; border-radius:3px; cursor:pointer; background-color:white; padding-right:10px; } #party_buttons div#reiniciarCoalic button span{display:block; float:left; } #party_buttons div#reiniciarCoalic button span svg{width:24px; height:24px;}