@font-face {
  font-family: "ShadowsIntoLight";
  src: url(../fonts/ShadowsIntoLight.ttf) format("truetype");
}

@font-face {
  font-family: "Ananda Personal";
  src: url(../fonts/Ananda_Personal_Use.ttf) format("truetype");
}

@font-face {
  font-family: "Broken Heart";
  src: url(../fonts/Broken_Heart.ttf) format("truetype");
}

@font-face {
  font-family: "Acme-Regular";
  src: url(../fonts/Acme-Regular.ttf) format("truetype");
}

.navbar {
  background-color: transparent;
}

.top-nav-collapse {
  background-color: #4285F4;
}

#Title {
  font-family: "Broken Heart";
  font-size: 3em;
  text-shadow: 3px 3px 2px rgb(20, 20, 20);
}

#Subtitle {
  margin-top: 3%;
  font-family: "Acme-Regular";
  font-size: 1.3em;
}

#TextHogar {
  text-shadow: 3px 3px 2px rgb(0, 0, 0);
}

.barPage {
  text-shadow: 0 0 20px rgb(252, 252, 252);
  font-size: 1.2em;
}

.logo3 {
  width: 15rem;
}

.separator {
  height: 2px;
  border: 0px solid #006666;
  background-image: linear-gradient(90deg, transparent, #006666, transparent);
  color:#006666;
}

.banner {
  /* padding-top: 60px; */
  height: 420px; 
}
.banner .ban_cont {
  height: 100%; 
}
.banner .ban_cont .ban_img {
  background-image: url("/img/Medicina-personalizada.jpg");
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; 
}

/* Figurita de Flechita azul*/
.shar {
  font-size: 1.5em;
  color: #819FF7;
}

.intro-nosotros{
  background-color: cornflowerblue;
}

.btn-wp{
  background-color: #088A08;
}

/* h6 {
  line-height: 1.7;
} */


/* Required for full background image */
.contact {
  height: 100%;
  min-height: 620px;
  background-image: url('https://mdbootstrap.com/img/Photos/Others/images/89.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

@media only screen and (max-width: 768px) {
  .navbar {
    background-color: #4285F4;
  }

  .contact {
    height: 100%;
    min-height: 800px;
    background-image: url('https://mdbootstrap.com/img/Photos/Others/images/89.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
  }

  .logo3 {
    width: 12rem;
  }
}        
          
@media screen and (max-width: 768px) and (orientation: portrait) {
  .banner {
    /* padding-top: 70px;  */
  }
  .banner .ban_cont .back_image_contacto {
    background-image: none; 
  } 
}