body{
  font-family: 'Montserrat', sans-serif;
  margin: 0;
}

header{
  align-items: center;
  background-color: hsl(0, 0%, 80%);
  display: grid;
  font-size: 2rem;
  grid-template-columns: repeat(3, 1fr);
  height: 10vh;
  justify-items: center;
  left: 0;
  position: fixed;
  top: 0;
  width: 100vw;
}

main{
  background-color: hsl(49, 60%, 85%);
  min-height: calc(90vh - 4rem);
  padding: 4rem 2rem;
}

p{
  background-color: hsl(0, 0%, 95%);
  border-radius: 1rem;
  margin-left: 0;
  margin-right: 15%;
  padding: 1rem;
}

.fecha{
  background-color: hsl(230, 100%, 80%);
  border-radius: 10px;
  margin: 1rem;
  padding: 0.5rem;
  text-align: center;
}

.file-selection-box{
  align-items: center;
  background-color: hsla(0, 0%, 0%, 70%);
  display: flex;
  height: 100vh;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100vw;
  z-index: 10;
}
.file-selection-box > div{
  align-items: center;
  background-color: hsl(0, 0%, 90%);
  border-radius: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  height: calc(80% - 4rem);
  justify-content: center;
  padding: 2rem;
  width: calc(80% - 4rem);
}

.hora-mensaje{
  color: hsl(0, 0%, 50%);
  font-size: 0.75rem;
  margin-top: 0.25rem;
  text-align: right;
}

.mensaje-propio{
  background-color: hsl(113, 80%, 70%);
  margin-left: 15%;
  margin-right: 0;
}