/* Una empresa de grupo proceso seguro */
#grupo_proceso_seguro {
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  position: relative;
  background-image: url('../../img/home/emyca_bg_intro.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.introText {
  width: 100%;
  height: auto;
  padding: 10% 15% 10% 15%;
  position: relative;
  overflow: hidden;
}

.introText h1,
.introText h2,
.introText a {
  text-transform: uppercase;
  text-align: left;
}

.introText h1,
.introText h2 {
  font-family: 'Futura';
  font-weight: 500;
  font-style: normal;
  color: #2f983c;
  margin: 0 0 0 0;
}

.introText h1 {
  font-size: 50px;
}

.introText h2 {
  font-size: 70px;
  transition: all 0.3s ease;
}

.introText a {
  font-family: 'Bw Surco';
  font-weight: 500;
  font-style: normal;
  color: #ffffff;
  border-radius: 25px;
  background: #2f983c;
  background-color: #2f983c;
  padding: 8px 20px 8px 20px;
  position: relative;
  transition: all 0.3s ease;
}

.introText a span {
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}

.introText a::before {
  content: '';
  width: 100%;
  height: 100%;
  background: #63acaf;
  background-color: #63acaf;
  position: absolute;
  border-radius: 25px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transition: all 0.3s ease;
}

.introText a:hover,
.introText a:active,
.introText a:focus {
  -webkit-box-shadow: 0px 0px 11px -1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 11px -1px rgba(0, 0, 0, 0.75);
  box-shadow: 0px 0px 11px -1px rgba(0, 0, 0, 0.75);
}

.introText a:hover::before,
.introText a:active::before,
.introText a:focus::before {
  width: 0;
}

.emycaMono {
  max-width: 470px;
  height: auto;
  position: absolute;
  top: 0;
  right: 20%;
  bottom: 0;
  margin: auto;
  z-index: 5;
  transition: all 0.3s ease;
}
/*  */

/* Unidad Verificadora (Slider)*/
#unidad_verificadora {
  width: 100%;
  height: auto;
  padding: 1% 0 1% 0;
  background: #e6e6e6;
  background-color: #e6e6e6;
  overflow: hidden;
  position: relative;
  z-index: 0;
}

.slider {
  width: 100%;
  height: auto;
  padding: 5% 15% 5% 15%;
  text-align: center;
}

.slider h1 {
  font-family: 'Rounded Elegance';
  font-weight: normal;
  font-style: normal;
  font-size: 40px;
  color: #6fbcc5;
  margin: 0 0 0 0;
}

.slider h2 {
  font-family: 'Rounded Elegance';
  font-weight: normal;
  font-style: normal;
  font-size: 25px;
  color: #6fbcc5;
  margin: 0 0 0 0;
  text-transform: uppercase;
}

.slidercontent {
  width: 100%;
  height: auto;
  padding: 30px 0 0 0;
  text-align: center;
}

.slidercontent p {
  font-family: 'Rounded Elegance';
  font-weight: normal;
  font-style: normal;
  font-size: 18px;
  color: #6fbcc5;
}

#buttonLeft {
  width: 60px;
  height: 60px;
  font-size: 40px;
  text-align: center;
  line-height: 60px;
  position: absolute;
  top: 0;
  left: 66px;
  bottom: 0;
  margin: auto;
  z-index: 10;
}

#buttonLeft i {
  color: #6fbcc5;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}

#buttonLeft:hover i {
  color: #ffffff;
}

#buttonLeft::after {
  content: '';
  width: 0;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  margin: auto;
  background: #2f983c;
  background-color: #2f983c;
  transition: all 0.3s ease;
}

#buttonLeft:hover::after {
  width: 100%;
  background: #6fbcc5;
  background-color: #6fbcc5;
}

#buttonRight {
  width: 60px;
  height: 60px;
  font-size: 40px;
  color: #6fbcc5;
  text-align: center;
  line-height: 60px;
  position: absolute;
  top: 0;
  right: 66px;
  bottom: 0;
  margin: auto;
  z-index: 10;
}

#buttonRight i {
  color: #6fbcc5;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}

#buttonRight:hover i {
  color: #ffffff;
}

#buttonRight::after {
  content: '';
  width: 0;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  margin: auto;
  background: #2f983c;
  background-color: #2f983c;
  transition: all 0.3s ease;
}

#buttonRight:hover::after {
  width: 100%;
  background: #6fbcc5;
  background-color: #6fbcc5;
}
/*  */

/* Acreditación EMA y STPS*/
#acreditacion_ema_stps {
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  background: #dcebec;
  background-color: #dcebec;
  overflow: hidden;
  position: relative;
}

.acreditacionText {
  width: 100%;
  height: auto;
  padding: 10% 15% 10% 15%;
}

.acreditacionText h1,
.acreditacionText h2 {
  font-family: 'Bw Surco';
  font-weight: normal;
  font-style: normal;
  font-size: 25px;
  color: #009a30;
  text-align: left;
  margin: 0 0 0 0;
}

.acreditacionLogos {
  width: 45%;
  height: auto;
  padding: 10% 0 0 0;
  float: left;
}

.acreditacionPlanta {
  width: 70%;
  height: auto;
  padding: 15% 15% 0 0;
  text-align: center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  /*border: 1px solid red;*/
}

/* .acreditacionPlanta img {
  animation: flecha3 120s ease-in-out infinite;
  position: relative;
  top: 0;
} */
/*  */

/* ANIMACIONES */
/* @keyframes flecha3 {
  0%{
    top: 0;
  }
  25%{
    top: -5%;
  }
  30%{
    top: -25%;
  }
  50%{
    top: -50%;
  }
  55%{
    top: -25%;
  }
  95%{
    top: -5%;
  }
  100%{
    top: -0;
  }
} */
/*  */

.animacionesHome {
  position: relative;
  /*border: 1px solid orangered;*/
}

.animacionesHome::after {
  content: '';
  background-image: url('/img/gifs/camion.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 150px;
  height: 150px;
  text-align: center;
  position: absolute;
  /*border: 1px solid blue;*/
  top: 70%;
  left: 50%;
  z-index: 4;
  mix-blend-mode: multiply;
  animation: mover 14s infinite;
}

.animacionesHome::before {
  content: '';
  background-image: url('/img/gifs/alerta1.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 50px;
  height: 50px;
  text-align: center;
  position: absolute;
  /*border: 1px solid blue;*/
  top: 50%;
  left: 25%;
  z-index: 4;
  animation: flotar 2s infinite alternate;
}

@keyframes mover {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(230px, -150px);
  }
}

@keyframes flotar {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-10px);
  }
}