html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, p, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, a, td, section {margin:0;padding:0;list-style: none;font-family: 'Open Sans', sans-serif;outline:0;font-size:100%;vertical-align:baseline;text-decoration: none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
 :focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse:collapse;border-spacing:0;}

body{
    /* background: #eaeaea; */
}
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
/*----------------------------------------------------------------*/
#widget-apruebo{
    display: flex;
    width: 100%;
    max-height: 200px;
    min-height: 200px;
    background: #ebf6ff;
    padding: 5px 25px 0 25px;
    color: #333;
    font-family: 'Lato', sans-serif;
    /* border: 1px solid black; */
    flex-flow: wrap;
    font-weight: lighter;
    margin: auto;
    border: 1px solid #d6e6ff;
    align-content: flex-start;
}

#widget-apruebo .right{text-align: right;}
#widget-apruebo .left{text-align: left;}
#widget-apruebo .rot-widget-ple{
    width: 100%;
    display: flex;
    color: #3078b6;
    margin: 0% 0 0 0;
    /* font-weight: bold; */
    text-transform: uppercase;
    font-size: 1em;
}
#widget-apruebo .rot-widget-ple strong{
 
margin-right: 4px;
}


#widget-apruebo .mesas-total{position:absolute;z-index: 9;right: 3px;top: 3px;background: #ffbf0040;padding: 5px;font-size: .7em;}


#widget-apruebo .rot-widget-ple strong:before{content:'';width: 138px;height: 3px;background: #db7332;display: table;position: absolute;margin-top: -2px;}
#widget-apruebo .cont-ranking{
    width: 100%;
    display: flex;
    flex-flow: wrap;
    /* background: #ccc; */
    border-top: 1px solid #efefef94;
    margin-top: 7px;
    align-self: flex-start;
}
#widget-apruebo .cont-ranking .cont-pregunta{
    width: 100%;
    flex-flow: wrap;
    font-size: .9em;
    margin: 3px auto 3px auto;
    line-height: 1.3;
}
#widget-apruebo .cont-ranking.tipo-organo .cont-pregunta{
    font-size: .8em;

}
#widget-apruebo .cont-ranking .cont-opciones{
    width: 100%;
    display: flex;
    margin: 0px auto 0px auto;
}
#widget-apruebo .cont-ranking .cont-opciones .opcion{
    width: 50%;
    font-weight: bold;
    font-size: .8em;
    text-transform: uppercase;
    line-height: 1.3;
}
#widget-apruebo .cont-ranking.tipo-organo .cont-opciones .opcion{

    font-size: .7em;

}
            
#widget-apruebo .cont-ranking .cont-barra{
    width: 100%;
    height: 7px;
    background: #d6d6d6;
    position: relative;
}
#widget-apruebo .cont-ranking.tipo-organo .cont-barra{
    height: 4px;
}

#widget-apruebo .cont-ranking .cont-barra #apruebo{background: #3078b6;width: 0%;height: 100%;position: absolute;transition: width 2s ease;}
#widget-apruebo .cont-ranking .cont-barra #rechazo{background: #c23036;width: 0%;height: 100%;display: flex;position: absolute;right: 0;transition:width 2s ease;}

#widget-apruebo .cont-ranking .cont-barra #constitucional{background: #3078b6;width: 0%;height: 100%;position: absolute;transition:width 3s ease;}
#widget-apruebo .cont-ranking .cont-barra #mixta{background: #c23036;width: 0%;height: 100%;display: flex;position: absolute;right: 0;transition:width 3s ease;}




#widget-apruebo .cont-ranking .cont-barra #mid{width: 1px;background: #FFC107;height: 20px;position: absolute;z-index: 999999;left: 0;right: 0;margin: -5px auto 0 auto;}
#widget-apruebo .cont-ranking .cont-barra #mid:after{content:"50%";font-size: .6em;color: #FFC107;position: absolute;top: 20px;left: -5px;}


#widget-apruebo .cont-ranking .cont-procentajes{
    width: 100%;
    display: flex;
    align-content: space-around;
    font-weight: normal;
    font-size: .9em;
    text-align: center;
    margin: 1px auto;
}
#widget-apruebo .cont-ranking .cont-procentajes .porcentaje{
    width: 50%;
    color: #3078b6;
}
#widget-apruebo .cont-ranking .cont-procentajes .porcentaje.blue{
    color: #3078b6;

   
}
#widget-apruebo .cont-ranking .cont-procentajes .porcentaje.red{
    color: #c23036;

}

@media only screen and (max-width: 767px){
#apruebo {
    display: flex;
    width: 98%;
    background: #0c569f;
    padding: 0%;
    color: #fff;
    justify-content: space-between;
    font-family: 'Lato', sans-serif;
    flex-direction: column;
}
#apruebo .cont-izq {
    width: 100%;
}
#apruebo .cont-der {
    width: 100%;
}

#widget-apruebo .cont-ranking .cont-opciones .opcion {
    width: 50%;
    font-weight: bold;
    font-size: .8em;
    text-transform: uppercase;
    line-height: 1.3;
}
#widget-apruebo .cont-ranking .cont-pregunta {
    width: 100%;
    flex-flow: wrap;
    font-size: .9em;
    margin: 10px auto 7px auto;
    line-height: 1.3;
}

#widget-apruebo .cont-ranking.tipo-organo .cont-opciones .opcion{

font-size: .45em;
}
#widget-apruebo .cont-ranking.tipo-organo .cont-pregunta{
    font-size: .65em;
}


#widget-apruebo {
    padding: 5px 5px 0 5px;

}
#widget-apruebo .rot-widget-ple {
    font-size: .9em;
}
}