/* Estilos generales */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
}

header {
    background: #4ad67d;
    color: #ffffff;
    padding: 10px 0;
    text-align: center;
    position: relative;
}

.menu-toggle {
    display: none; /* Ocultar el menú en pantalla grande */
    flex-direction: column;
    cursor: pointer;
    padding: 10px;
}

.menu-toggle .bar {
    height: 3px;
    width: 25px;
    background: white;
    margin: 4px 0;
}



body{
  margin:0;
  font-family:Arial;
}

.navbar{
  background:#4ad67d;
  color:white;
  display:flex;
  justify-content:center;
  align-items:center;
  
}

ul{
  list-style:none;
  display:flex;
}

ul li{
  margin:10px;
}

ul li a{
  color:white;
  text-decoration:none;
}

.menu-icon{
  display:none;
  font-size:25px;
  cursor:pointer;
}

/* VERSION TELEFONO */
@media (max-width:768px){

ul{
  display:none;
  flex-direction:column;
  width:100%;
  background:#333333;
}

ul.show{
  display:flex;
}

.menu-icon{
  display:block;
}

}
/* para que se vea bien en el navegador*/
.contenedor{
  display:flex;
  justify-content:center;
  /*align-items:center;*/
  height:100vh;
}
/* para que se vea bien en el telefono*/
img{
  max-width:100%;
  height:auto;
}

.titulo{
  text-indent:40px;
  margin-top:20px;
  font-weight:bold;
}

p{
  line-height:1.6;      /* espacio entre líneas */
  margin-bottom:20px;   /* espacio entre párrafos */
  text-indent:40px;     /* sangría */
  text-align:justify;   /* texto justificado */
}

.parrafo {
  text-indent: 30px;       /* Sangría al inicio */
  line-height: 1.6;        /* Espacio entre líneas */
  margin-bottom: 20px;     /* Espacio entre párrafos */
  text-align: justify;      /* Justificar texto */
  font-size: 16px;         /* Tamaño legible en móviles */
}
@media (max-width: 768px) {
  .parrafo {
    font-size: 15px;       /* Tamaño un poco más pequeño si se necesita */
    line-height: 1.5;      /* Espaciado más compacto para pantallas pequeñas */
    text-indent: 25px;     /* Sangría proporcional al ancho */
    margin-bottom: 15px;   /* Menor separación entre párrafos */
  }
}


.parrafo-centrado {
  max-width: 1000px;      /* Ancho máximo del párrafo */
  margin: 0 auto;         /* Centra el párrafo horizontalmente */
  padding-left: 30px;     /* Sangría izquierda */
  padding-right: 30px;    /* Sangría derecha */
}

.parrafo-centrado p {
  text-align: justify;    /* Justifica el texto */
  line-height: 1.6;       /* Espacio entre líneas */
}
/*Para telefono*/
@media (max-width: 768px) {
  .parrafo-centrado {
    max-width: 90%;        /* Ocupa casi todo el ancho de la pantalla */
    padding-left: 20px;    /* Sangría proporcional al ancho de la pantalla */
    padding-right: 20px;
  }

  .parrafo-centrado p {
    line-height: 1.5;      /* Espaciado más compacto para móvil */
  }
}

footer {
    text-align: center;
    padding: 10px 0;
    background: #4ad67d;
    color: #ffffff;
    position: relative;
    bottom: 0;
    width: 100%;
}