/* texto banner video */
#intro-content{
  transition: position .2s ease;
}
#texto-oculto{
  width: 750px;
  background: red;
  position: relative;
  height: auto;
  transition: height .2s ease;
  color: white;
}
#texto-oculto .textoBanner{
  transition: height .2s ease, left .2s ease, right .2s ease;
  position: absolute;
  width: 100%;
  left: 200%;
  height: 0;
  font-size: 0.8em;
  overflow-y: auto;
  padding: 0 20px;
}
#texto-oculto .textoBanner.activo{
  height: 180px;
  left: 0;
}
#texto-oculto .textoBanner h4{
  font-size: 28px;
  font-weight: 600;
}
#texto-oculto .textoBanner{
  text-shadow: 0 0 3px var(--color2);
}
#texto-oculto .textoBanner#vision h4{
  margin-top: 1em;
}
#texto-oculto .textoBanner#vision p{
  font-size: 18px;
  font-weight: 400;
}
#texto-oculto .textoBanner#mision p{
  font-weight: 400;
}
@media (max-width: 768px) {
  #texto-oculto .textoBanner h4{
    margin-top: 2em;
  }
}
@media (max-width: 400px) {
  #texto-oculto .textoBanner#vision h4{
    margin-top: 1.5em;
  }
  #texto-oculto .textoBanner#mision h4{
    margin-top: 0.5em;
  }
  #texto-oculto .textoBanner#mision p{
    width: 90%;margin: 0 auto;
    line-height: 24px;
  }
  #intro .textoBanner{
      font-size: 14px;
    }
  #texto-oculto .textoBanner.activo{
  height: 190px;
  left: 0;
}
}
/* scrollbar del texto */
  #texto-oculto .textoBanner::-webkit-scrollbar {
    width: 5px;
  }
  #texto-oculto .textoBanner::-webkit-scrollbar-track{
    background: rgba(27, 67, 96,.5);
  }
  #texto-oculto .textoBanner::-webkit-scrollbar-thumb {
    background: #87C04B;
  }
@media (max-width: 767px) {
  #texto-oculto {
  width: 100%;
  }
  #texto-oculto .textoBanner{
    
  }
  
  
}

/* #graficoContenedor{display: flex;justify-content: center;align-items: center;} */
#textoContenedor{width: 100%;height: 100%;min-height:400px;padding: 3em 1em;overflow: hidden;position:relative;}
#textoContenedor .texto{overflow-y:auto;max-height: 100%;position:absolute;width: 90%;padding: 0 0.5em 4em;left:100% ;transition:.2s all ease-in-out;}
#textoContenedor .texto.activo{left: 1em;}


/* modificando el texto */
#textoContenedor .texto p{font-size: 14px;line-height: 24px;}

#textoContenedor .texto cite{display: block; padding: 1em;line-height: 26px;color:#525F69;}
/* scrollbar del texto */
.texto::-webkit-scrollbar {
  width: 5px;
}
.texto::-webkit-scrollbar-track{
  background: rgba(27, 67, 96,.5);
}
.texto::-webkit-scrollbar-thumb {
  background: #87C04B;
}
/* fin scrollbar */


/* SVG */
SVG{width: 100%;}
SVG *{outline:none;
	-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
.figuraVerdeC{fill:#E7F1CF; transition: fill .2s ease;}
.figuraGris{fill:#D4D4D4; transition: fill .2s ease;}
.verde{fill:#87C04B; transition:fill .2s ease;}
.lineasTexto{fill:none; transition: fill .2s ease;}
.central{fill:#FFFFFF;font-size:20px;font-weight: 700;}
tspan{font-weight: 400;}
g g{cursor:pointer;}
/* SVG HOVER */
/* cuando el mouse se ponga encima de un grupo dentro de otro grupo */
#GRAFICO g g:hover .figuraVerdeC, #GRAFICO g g.activo .figuraVerdeC{fill:#a8d44a;}
#GRAFICO g g:hover tspan,#GRAFICO g g.activo tspan{fill:#fff;}
#GRAFICO g g:hover .figuraGris,#GRAFICO g g.activo .figuraGris{fill:#1b4360;}