html, body {
  height: 100%;
}

.navbar {
  height: 100vh; /* Altura completa de la ventana */
  position: fixed; /* Fija la barra de navegación al lado izquierdo en pantallas grandes */
  top: 0;
  left: 0;
  width: 200px; /* Ajusta el ancho según tu preferencia */
}

.navbar-toggler {
  margin-left: auto;
}

.colornav {
  background-color: #343a40; /* Color de fondo de la barra de navegación */
}

.tam {
  width: 50px; /* Ajusta el tamaño del ícono de la marca */
}

/* Para pantallas pequeñas (móviles) */
@media (max-width: 767.98px) {
  .navbar {
    position: relative;
    height: auto;
    width: 100%;
  }

  .container-fluid {
    margin-left: 0; /* En pantallas pequeñas, el contenido ocupa todo el ancho */
  }

  .navbar-collapse {
    width: 100%; /* La barra de navegación toma todo el ancho en pantallas pequeñas */
  }

  .navbar-nav {
    width: 100%; /* Asegura que el menú ocupe todo el espacio cuando se expanda en móviles */
  }

  .navbar-toggler {
    margin-right: 0; /* Centra el botón del menú en móviles */
  }
}

/* Para pantallas más grandes */
@media (min-width: 768px) {
  .container-fluid {
    margin-left: 200px; /* Mueve el contenido a la derecha en pantallas grandes */
  }
}
/* Estilo para los párrafos <p> */
p {
  font-size: 1rem; /* Tamaño de letra para pantallas grandes */
  line-height: 1.6; /* Espacio entre las líneas para mejorar la legibilidad */
  text-align: justify; /* Justifica el texto para que quede alineado en ambos lados */
  margin-bottom: 20px; /* Espacio inferior entre párrafos */
  padding: 10px; /* Espaciado interno */
  color: #333; /* Color del texto */
}

/* Título principal */
h1 {
  font-size: 2rem; /* Tamaño del título */
  margin-top: 20px;
  margin-bottom: 20px;
  color:#d5843a;
}

.gold{
    color:#d5843a;
}