body {
  background: #3249fc;
  color: #ffffff;
  font-family: 'Roboto', sans-serif;
  margin: 0;
  height: 100vh; /* ocupa toda la altura de la ventana */
  display: flex;
  justify-content: center; /* centra horizontalmente */
  align-items: center; /* centra verticalmente */
}
.intro {
  box-shadow: 4px 19px 29px -13px rgba(39,41,121,0.66);
  -webkit-box-shadow: 4px 19px 29px -13px rgba(39,41,121,0.66);
  -moz-box-shadow: 4px 19px 29px -13px rgba(39,41,121,0.66);
  height: 400px;
  margin: auto;
  max-width: 750px;
  position: relative;
}
.fondo {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 0;
  opacity: 0.7;
}
.texto {
  float: left;
  margin-left: 40px;
  width: 50%;
  z-index: 10;
}
.texto img {
  width: 240px;
  margin-bottom: 25px;
}
.texto h2 {
  margin: 0px;
  padding-bottom: 25px;
}
.foto {
  position: absolute;
  bottom: 0px;
  right: 60px;
  z-index: 10;
}
.redes {
  display: block;
}
.redes a {
  border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  font-size: 1.3em;
  text-decoration: underline;
  margin: auto 3px;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
}
.redes a:hover {
  background-color: #24242d;
}
.redes a.facebook {
  background-color: #4769f1;
}
.redes a.linkedin {
  background-color: #466fef;
}
.redes a.instagram {
  background-color: #676eef;
}

@media (max-width: 765px) {
  .container {
    max-width: 94% !important;
    padding: 0px !important;
    margin: auto !important;
  }
  .foto {
    position: absolute;
    bottom: 0px;
    right: 40px;
    width: 240px;
  }
  .texto {
    float: left;
    margin-left: 30px;
    width: 55%;
  }
  .fondo {
    opacity: 0.5;
    width: 150px;
  }
}
@media (max-width: 470px) {
  .intro {
    height: 550px;
  }
  .fondo {
    top: 30px;
    opacity: 0.3;
    width: 120px;
  }
  .texto img {
    width: 200px;
  }
  .foto {
    right: 20px;
  }
}