/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

.header-img {
    display: block;
    margin-left: auto;  /* Empuja desde la izquierda */
    margin-right: auto; /* Empuja desde la derecha */
    width: 50%;         /* O el tamaño que tú quieras (px, %, etc.) */
    height: 50%;
}
/* El cuadro de selecciones */
.menu-container {
        /* Activa el modo fila */
    justify-content: space-around; /* Centra los botones (puedes usar 'space-around' también) */
    background-image: url("https://i.imgur.com/bh7H1EF.jpeg");
    padding: 5px;
    border: 5px solid #391f04;  /* Por si quieres que parezca un cuadro delimitado */
    margin-left: auto;  /* Empuja desde la izquierda */
    margin-right: auto; /* Empuja desde la derecha */
    width: 50%;         /* O el tamaño que tú quieras (px, %, etc.) */
    height: 35px;
    
}

/* Estilo para los links dentro del cuadro */
.menu-container a {
    color: darkblue;
    text-decoration: none;
    padding: 0 20px;       /* Espacio entre las opciones */
    font-family: andale-mono;
}

.menu-container a:hover {
    text-decoration: underline; /* Efecto al pasar el mouse */
}

.contenedor-padre {
  display: center;
  justify-content: center; /* Centra horizontalmente */
  align-items: center;     /* Centra verticalmente */
  height: 255px;           /* Usa el 100% de la altura de la vista */
  width: 100%;
  min-width: 1340px;

}
  
.Website-resume {
  width: 650px;              /* El cuadro ocupa el 50%, dejando 25% a cada lado */
  padding: 20px;
  background-image: url("https://i.imgur.com/oveig0a.jpeg");
  border: 5px solid #391f04;
  box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
  text-align: center;
  flex-shrink: 0;
}

.decoracion {
  position: fixed; /* La clave para que se muevan con el scroll */
  top: 85%;        /* Las situamos a la mitad de la altura */
  transform: translateY(-50%); /* Ajuste perfecto para centrar verticalmente */
  width: 200px;    /* Ajusta el tamaño según necesites */
  z-index: 100;    /* Para que queden por encima del fondo */
  pointer-events: none; /* Opcional: permite hacer click "a través" de ellas */
}

.izq {
  left: 0;         /* Pegada al borde izquierdo */
}

.der {
  right: 0;        /* Pegada al borde derecho */
}
  
body {
  background-color: #E5D3A1; /* El color que elijas */
  min-width: 1340px;
  margin: 0;
  font-family: 'Courier New', Courier, monospace; /* Opcional: para el estilo de diario */
}