.contacto {
    width: 40%;
    height: 65%;
    background-color: #333;
    margin-left: 5%;
    color: #ffffff;
    opacity: 0.85;
}

.contactos {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
}

.contactos div {
    width: 40%;
    box-sizing: border-box;
}

.contacto div span {
    display: block;
}

.contacto3 {
  width: 100%;
}



/*--------------------------------------------------------------------*/




.formulario {
  width: 40%;
  background-color: #ffffff;
  border-radius: 3%;
  margin-left: 10%;
  border: crimson 1px solid;
}

.formulario h1 {
  display: flex;
  justify-content: center;
}

.formulario p {
  width: 80%;
  margin: 0 auto;
  text-align: center;
}

.formulario input {
  height: 50px;
  width: 100%;
  margin-bottom: 20px;
}

.formulario textarea {
  height: 150px;
  width: 100%;
  margin-bottom: 20px;
}

.formulario div {
  height: 13%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.formulario input::placeholder,
textarea::placeholder {
  color: #999;
  font-style: italic;
  font-size: 14px;
}

.error {
  color: red;
  font-size: 12px;
}