/* Las unidades vw (viewport width) y vh (viewport height) en CSS son unidades de medida relativas a la ventana gráfica o viewport del navegador. La unidad vw representa un porcentaje del ancho del viewport, mientras que la unidad vh representa un porcentaje de la altura del viewport. Estas unidades son útiles para crear diseños responsive basados en el tamaño de la ventana del navegador.  */

*{
  margin: 0;
}

.contenedor{
  /* width: 100%;
  height: 100%; */
  width: 100vw;
  height: 100vh;
  background-color: blueviolet;
}

.contenedor2{
  /* width: 100%;
  height: 100%; */
  width: 50vw;
  height: 100vh;
  background-color: red;
}

.caja {
  width: 40vw; /* Ancho del 40% del ancho del viewport */
  height: 100px;
  margin: 10px;
  background-color: #008CBA;
  color: #fff;
  text-align: center;
  padding: 10px;
}

