a.navegacion-contenido.contacto {
  font-weight: bold;
}

main {
  height: 900px;
}

section.contacto {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  height: calc(900px - 87px);
}

.datos-contacto {
  width: 55%;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

.datos-contacto h2 {
  font-size: 31px;
}

.encabezado {
  font-style: italic;
  font-weight: bold;
}

.redes-sociales {
  width: 50%;
  height: 40%;
  display: flex;
  flex-wrap: wrap;
  align-self: center;
}

.redes-sociales img {
  height: 100%;
  width: 100%;
}

/* Se recogerá cada icono individualmente, para poder posicionarlo con un posicionamiento relativo. */
.redes-sociales .logo {
  height: 40%;
  width: 40%;
  position: relative;
  left: 30%;
  top: 40%;
}

.redes-sociales .telegram {
  height: 10%;
  width: 10%;
  position: relative;
  right: 35%;
  top: 50%;
}

.redes-sociales .whatsapp {
  height: 10%;
  width: 10%;
  position: relative;
  right: 30%;
  top: 30%;
}

.redes-sociales .instagram {
  height: 10%;
  width: 10%;
  position: relative;
  top: 30%;
}

.redes-sociales .twitter {
  height: 10%;
  width: 10%;
  position: relative;
  right: 15%;
  top: 15%;
}

.redes-sociales .facebook {
  height: 10%;
  width: 10%;
  position: relative;
  left: 5%;
  top: 50%;
}

.redes-sociales a:hover {
  width: 11%;
  height: 11%;
}

.redes-sociales .logo:hover {
  width: 41%;
  height: 41%;
}
.formulario-contacto {
  width: 40%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

input,
select,
textarea {
  border: 1px solid black;
  width: 80%;
  height: 7%;
  padding-left: 3%;
  margin-top: 4%;
  font-size: 15px;
  color: black;
  font-weight: bold;
  background-color: white;
}

textarea {
  padding-top: 1%;
  height: 17%;
  resize: none;
}

input::placeholder,
textarea::placeholder {
  color: black;
  font-size: 15px;
  font-weight: bold;
}

input:focus,
textarea:focus {
  border: 2px solid orange;
  outline: none;
}

.checkbox {
  font-weight: bold;
  margin-top: 4%;
  margin-left: 10%;
  font-size: 17px;
  display: flex;
  flex-wrap: wrap;
  align-self: flex-start;
  justify-content: center;
  align-items: center;
  width: 25%;
}
/* Le indicamos al label que ocupe todo el ancho del div, para que el texto quede ajustado. */
.checkbox label {
  width: 100%;
}

.checkbox input {
  margin-top: 0;
  width: 15%;
  height: 80%;
}

.checkbox a {
  margin-left: 1.5%;
  color: blue;
}
.boton.boton-circular {
  font-size: 20px;
  height: 5%;
  display: flex;
  align-self: end;
  border-radius: 25px;
  width: 40%;
  margin-right: 15%;
  padding-left: 0%;
}

.boton.boton-circular:hover {
  cursor: pointer;
  background-color: orange;
}

/* Media query para poder ajustar el formato de la página, cuando el ancho sea menor de 600px. */
@media screen and (width < 600px) {
  main {
    height: 1100px;
  }
  section.contacto {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
  }
  .datos-contacto {
    width: 95%;
    justify-content: center;
    justify-content: space-evenly;
    height: 50%;
  }
  .datos-contacto h2 {
    font-size: 25px;
  }
  .formulario-contacto {
    border-top: 1px solid black;
    width: 95%;
    height: 50%;
  }
  .checkbox {
    font-size: 15px;
  }
  .redes-sociales .telegram,
  .redes-sociales .whatsapp,
  .redes-sociales .instagram,
  .redes-sociales .twitter,
  .redes-sociales .facebook {
    height: 12%;
    width: 10%;
  }
  .redes-sociales a:hover {
    height: 13%;
  }
}