@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Roboto+Condensed:ital,wght@0,300;1,300&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.home-title1 {
  background-image: url(../img/_DSC2795.jpg);
  background-position: center;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 0%;
  opacity: 1;
  display: flex;
  align-items: center;
  
  box-shadow: 5px 5px 5px rgb(130, 130, 130);
 
}

.home-title1 img{
  transition: opacity 0.5s ease;
}

.home-title1 img.fade-out {
  opacity: 0;
}
.titec h1 {
  
  font-weight: 800;
   font-family: "Roboto";
   color: #ffffff;
   text-shadow: 1px 1px 1px rgb(70, 69, 69); 
   animation: fundido ease 4s;
   animation-iteration-count: 1;
   animation-fill-mode: forwards;
   margin-left: 7%;
}
.blanco{
  font-family: "roboto";
  font-size: 1.7em;
  font-weight: 700;
  margin-top: 2%;
  color: #ffffff;
  opacity: 0.9;
  text-shadow: 1px 1px 1px rgb(70, 69, 69) ;
}

h3{
  display: inline-block;
  position: relative;
}
h3::after,h3::before{
content: "";
position: absolute;
width: 3px;
height: 8px;
background-color: #ffffff;
opacity: 0.5;
}
.gr:hover img{
  border-radius: calc(0.375rem - 1px);
    -webkit-transform:scale(1.1);transform:scale(1.1);
}
.titec{
  font-size: 12vh;
width: 85% ;
}
.syg{

  background-color:  #666666;
  font-family: "roboto";
  color: #f8f8f8;
  font-weight: 100;
}
.textoTecno{
  font-size: 1.2em;
  font-family: "montserrat";
  font-weight: 800;
  color: #615f5f;
}
.timeline{
  border-radius: 20%;
  box-shadow: 10px 10px 60px -21px rgba(0,0,0,0.75);
}
.timeline h5{
  color: #000000;
}
.timelinetex{
  font-family: "roboto";
  color: #ffffff;
}
.card-text{
  color: #666666;
  font-family: "roboto";
}
.card-body h5{
color: #77a187;
font-family: "roboto";
font-weight: 900;

}

.tituloProceso{
  font-family: "montserrat";
  font-size: 5vw;
  font-weight: 800;
  color: #615f5f;
  padding-top: 10vh;
  
  
}
.tituloTecno2{
    font-size: 4vh;
    font-family: "montserrat";
    text-shadow: 2px 2px 4px rgb(37, 56, 39), 0 0 1em rgb(180, 207, 183), 0 0 0.2em rgb(4, 43, 21);
    color: #ffffff;
      margin-top: 5%;
      margin-bottom: 5%;
}
.tecnoprocesos{
  margin-top: 5vh;
}
#fotosProcesos{
  border-radius: 6px;
}

.contenedorProceso{
  margin-top: 3%;

}
.horizontal-timeline .items {
  border-top: 3px solid #e9ecef;
}

.horizontal-timeline .items .items-list {
  display: block;
  position: relative;
  text-align: center;
  padding-top: 70px;
  margin-right: 0;
}

.horizontal-timeline .items .items-list:before {
  content: "";
  position: absolute;
  height: 36px;
  border-right: 2px dashed #dee2e6;
  top: 0;
}
h5.pt-2.py-5{
  color: #ffffff;
  font-family: "montserrat";
}


.back  {
  background-color: #7ea470;

  box-shadow: -3px -5px 12px 3px rgb(130, 130, 130);
}
.back1 {
  background-color: #7ea470;
  box-shadow: 5px 5px 5px rgb(130, 130, 130);
}
.mp{
  text-decoration: none;
  color: #4b4b4b;
  font-family: "montserrat";
}
.mx-auto p a:hover{
  color:#4d8439
 }
 

@media (min-width: 1140px) {
  .horizontal-timeline .items .items-list {
    display: inline-block;
    width: 24%;
    padding-top: 45px;
  }

  .horizontal-timeline .items .items-list .event-date {
    top: -40px;
  }
}
@media (max-width: 550px) {
  .gr:hover img{
    border-radius: calc(0.375rem - 1px);
      -webkit-transform:scale(1.0);transform:scale(1.0);
  }
}