/* ABRE FECHA HP */
.inactivoHP {background-color: var(--fundo3); width: auto; cursor: pointer; font-size:0.8em; color: var(--texk) ; 
        border: 2px solid var(--texn); border-radius: 0.5em; border-style: outset; text-align: left;
        display: inline ; }  /* text-align: left;  */
.inactivoHP:before {content: '► Ver mais..'; color: var(--texg); font-size: 1em;  }  
/*.inactivo:after {content: '- Abrir '; color: var(--texli); font-weight:bold; } /*  font-size: 1.2em; */
.inactivoHP:hover  {cursor: pointer; background-color: orangered; color: white; }  /*  font-size:0.93em;      */
/*.activo {background-color: rgb(168, 156, 85); text-align: left; font-size:0.90em; color: black;
        border: solid 4px var(--texgg); border-radius: 5px;  }  /* var(--fundo); color: maroon;   */
.activoHP {background-color:brown; width: auto; font-size:0.8em; text-align: left; color: white;
            border: 2px solid var(--texgg);     }  /*   maroon;  */
.activoHP:before  {background-color: white; content: "▼"; color: red; font-size: 1em; } 
.activoHP:before  {content: "▼"; color: var(--texr); } /* font-size: 1.2em; */
.activoHP:after   {content: "..Ver menos ▲"; color:lime; }    /* color:#01f06c;  */
.activoHP:after:hover  {content: "..Ver menos ▲"; border: 2px solid var(--texn); color:cyan; font-size: 1.2em;}  /* color:#01f06c; */
.activoHP:hover  {cursor: pointer; background:red; border: 2px solid var(--texn); color: black; }  /*  font-size:0.93em;      */
.abertoHP {background: var(--fundo); padding-left: 0.2em; font-size:0.8em; color: var(--texn); 
           border: solid 2px var(--texgg); margin-bottom: 5px; }  /* padding: 0px 0px 0px 3px; */
.fechaHP {background-color: var(--texgg); cursor: pointer; border-style: none;
          display: inline; padding: 0px 6px 0px 6px;}