ul {

  list-style: none;

  padding: 0;

}



.logo {

  text-align: center;

  font-size: 3em;

}



.logo span {

  color: #b70e21;

}



.contact-wrapper {

  box-shadow: 0 0 20px 0 rgba(255, 255, 255, 0.3);

  display: flex; 

  justify-content: space-between; 

  gap: 20px; 

  flex-wrap: wrap; 

}



.contact-wrapper > * {

  padding: 1.5em; 

}



.contact-form {

  background: white;

}



.contact-form form label {

  display: block;

}



.contact-form form .formText {

  margin: 0;

  padding: 0.9em;

  color: #9698a6;

}


.formText{
  margin: 0;

  padding: 0.9em;

  color: #9698a6;

  font-size: 16px;
}


.contact-form form .block {

  grid-column: 1 / 3;

}



.contact-form form .buttonForm,

.contact-form form input,

.contact-form form textarea {

  width: 100%;

  max-height: 100px;

  padding: 0.4em;

  border: none;

  background: none;

  outline: 0;

  color: #fff;

  border: 1px solid hsl(200, 86%, 38%);

  border-radius: 25px;

}



.contact-form form .buttonForm {

  background: hsl(197, 88%, 45%);

  border: 0;

  border-radius: 25px;


  text-transform: uppercase;

  padding: 0.9em;

}


.block{
  padding: 0.9em;
}


.contact-form form .buttonForm:hover,

.contact-form form .buttonForm:focus {

  background: hsl(200, 86%, 38%);

  color: #fff;

  transition: background-color 1s ease-out;

  outline: 0;

}



.contact-form-column,

.contact-links-column,

.contact-info-column {

  flex: 1 1 33%;

  box-sizing: border-box;

}



.contact-columns {

  display: flex;

  width: -webkit-fill-available;

  gap: 10px;

}



.linkRedes {

  font-size: 18px;

  font-weight: 300;

}



.contact-links-column {

  padding: 20px;

}



.contact-links-column h3 {

  margin-bottom: 30px;

  color: black;

  font-weight: 300;

}



.contact-links-column ul {

  display: flex;

  flex-direction: column;

  justify-content: center;

  gap: 20px;

  list-style-type: none;

  padding: 0;

}



.contact-links-column li {

  margin-bottom: 5px;

}



.contact-links-column a {

  text-decoration: none;

  color: rgb(19, 167, 225);

}

#titleRedes{
  font-size: 21px;
  font-weight: 400;
}


.contact-info-column {

  text-align: center;

}



.contact-info img {

  width: 100%;

  height: auto;

}



.titleForm {

  display: flex;

  justify-content: center;

  align-items: center;

  margin: 20px;

}



.contact-form input {

  color: black !important;

  margin: 0px;

}



.moreInfo {

  color: white;

  font-weight: bold;

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

}



.moreInfo h2 {

  color: black;

}



.contact-form textarea {

  color: black !important;

}



.redes {

  width: 100%;

  height: 100%;

  display: flex;

  flex-direction: column;

  justify-content: space-evenly;

  align-items: flex-start;

}



.redes img {

  max-width: 105px;

  max-height: 119px;

}



.contact-info h4 {

  font-size: 16px;

  color: #9698a6;

}



.logoContacto {

  max-width: 40px;

  max-height: 40px;

}



.error {

  color: red;

  font-size: 0.8em;

}



@media (max-width: 700px) {

  .contact-wrapper {

    flex-direction: column;

  }



  .contact-columns {

    display: flex;

    flex-direction: column;

  }



  .contact-form-column,

  .contact-links-column,

  .contact-info-column {

    flex: 1 1 100%;

    min-width: auto;

  }



  .contact-wrapper > * {

    padding: 1em;

  }

}