/* INICIO */
#intro {
   width: 100%;
   height: auto;
   padding: 200px 0 50px 0;
   background: #ffffff;
   background-color: #ffffff;
   position: relative;
   overflow: hidden;
   transition: all .3s ease;
}

.introInfo {
    width: 100%;
    height: auto;
    padding: 0 15% 0 15%;
    position: relative;
    transition: all .3s ease;
}

.introHeader {
    width:100%;
    height: auto;
    padding: 0 25% 0 0;
    text-align: left;
    position: relative;
    transition: all .3s ease;
}
.introHeader h1 {
    font-family: 'Metropolis';
    font-size: 33px;
    color: #11a490;
    font-weight: bold;
    font-style: normal;
    padding: 0 0 0 0!important;
    margin: 0 0 0 0!important;
    text-transform: uppercase;
    transition: all .3s ease;
}
.introHeader p.subtitle {
    font-family: 'Metropolis';
    font-size: 25px;
    font-weight: normal;
    font-style: normal;
    color: #11a490;
    padding: 0 0 0 0!important;
    margin: 0 0 0 0!important;
    transition: all .3s ease;
}
.introHeader p.info {
    font-family: 'Metropolis';
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    color: #000000;
    padding: 0 25% 0 0!important;
    margin: 0 0 0 0!important;
    transition: all .3s ease;
}
.introHeader .btnIntro {
    font-family: 'Metropolis';
    background: #ffcc6a;
    background-color: #ffcc6a;
    color: #ffffff;
    font-weight: 500;
    font-style: normal;
    box-shadow: none;
    margin: 25px 0 0 0;
    transition: all .3s ease;
}
.introHeader .btnIntro:hover {
    background: #00a28a;
    background-color: #00a28a;
}

.introFooter {
  width: 100%;
  height: auto;
  padding: 75px 45% 0 0;
  position: relative;
  transition: all .3s ease;
}

.introFooterImg {
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  line-height: 0;
  overflow: hidden;
  text-align: center;
  position: relative;
  transition: all .3s ease;
}
.introFooter img {
  max-width: 100%;
  height: auto;
  position: relative;
  transition: all .3s ease;
}
.introFooterInfo {
  width: 100%;
  height: auto;
  padding: 25px 0 0 0;
  text-align: center;
  position: relative;
  transition: all .3s ease;
}
.introFooter p {
  font-family: 'Metropolis';
  font-size: 18px;
  color: #11a490;
  font-weight: bold;
  font-style: normal;
  margin: 0 0 0 0!important;
  padding: 0 0 0 0!important;
  transition: all .3s ease;
}
.personajeIntro {
  max-width: 100%;
  height: auto;
  position: absolute;
  top:0;
  right: 0;
  bottom: 0;
  margin: auto;
  transition: all .3s ease;
}

.introLideres {
  width: 100%;
  height: auto;
  padding: 50px 25% 0 25%;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}
.introLideres h1 {
  font-family: 'Metropolis';
  font-size: 40px;
  font-weight: bold;
  font-style: normal;
  color: #ffb649;
  padding: 0 0 0 0!important;
  margin: 0 0 25px 0!important;
  text-transform: uppercase;
  transition: all .3s ease;
}
.introLideres p {
  font-family: 'Rounded Elegance';
  font-size: 16px;
  color: #000000;
  font-weight: normal;
  font-style: normal;
  transition: all .3s ease;
}

.btnCertificacion {
  font-family: 'Metropolis';
  font-weight: 500;
  font-style: normal;
  background: #00a28a;
  background-color: #00a28a;
  color: #ffffff;
  box-shadow: none!important;
  border-radius: 50px 50px 50px 50px;
  -moz-border-radius: 50px 50px 50px 50px;
  -webkit-border-radius: 50px 50px 50px 50px;
}
.btnCertificacion:hover {
    background: #ffcc6a;
    background-color: #ffcc6a;
}
/*  */

/* La confiabilidad nos caracteriza */
#confiabilidad_caracteriza {
  width: 100%;
  height: auto;
  padding: 50px 20% 100px 20%;
  background: #00a28a;
  background-color: #00a28a;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}

.confiabilidadImg {
  width: 100%;
  height: auto;
  text-align: center;
  padding: 55px 0 0 0;
  line-height: 0;
  position: relative;
  transition: all .3s ease;
}
.confiabilidadImg img {
  max-width: 100%;
  height: auto;
  position: relative;
  transition: all .3s ease;
}

.confiabilidadInfo {
  width: 100%;
  height: auto;
  text-align: left;
  padding: 50px 10% 0 10%;
  position: relative;
  z-index: 5;
  transition: all .3s ease;
}
.confiabilidadInfo h1 {
  font-family: 'Metropolis';
  font-size: 45px;
  font-weight: bold;
  font-style: normal;
  color: #ffffff;
  transition: all .3s ease;
}
.confiabilidadInfo h1 span {
  font-weight: normal;
  font-style: normal;
  padding: 0 0 0 0!important;
  margin: 0 0 25px 0!important;
  transition: all .3s ease;
}
.confiabilidadInfo p {
  font-family: 'Metropolis';
  font-size: 16px;
  color: #ffffff;
  margin: 0 0 0 0!important;
  padding: 0 0 0 0!important;
  font-weight: normal;
  font-style: normal;
  transition: all .3s ease;
}

.confiabilidadContacto {
  font-family: 'Metropolis';
  font-size: 17px;
  letter-spacing: 1px;
  color: #ffcc6a;
  font-weight: bold;
  font-style: normal;
  text-transform: uppercase;
  top: 50px;
  position: relative;
  transition: all .3s ease;
}
.confiabilidadContacto:hover {
  color: #ffffff;
}

.confiabilidadIntro {
  max-width: 100%;
  height: auto;
  position: absolute;
  top:0;
  right: 0;
  bottom: 0;
  margin: auto;
  transition: all .3s ease;
}
/*  */

/* Ofrecemos certificaciones en: */
#ofrecemos_certificaciones {
  width: 100%;
  height: auto;
  padding: 100px 20% 200px 20%;
  background: #ffffff;
  background-color: #ffffff;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}

.ofrecemosHeader {
  width: 100%;
  height: auto;
  padding: 0 0 50px 0;
  text-align: left;
  position: relative;
  transition: all .3s ease;
}
.ofrecemosHeader h1 {
  font-family: 'Metropolis';
  font-size: 45px;
  font-weight: bold;
  font-style: normal;
  padding: 0 0 0 0!important;
  margin: 0 0 0 0!important;
  color: #9b9b9b;
  transition: all .3s ease;
}

.ofrecemosContent {
  width: 100%;
  height: auto;
  position: relative;
  padding: 0 20% 0 0;
  text-align: left;
  transition: all .3s ease;
}

.ofrecemosList {
  width: 100%;
  height: auto;
  position: relative;
  padding: 0 0 15px 0;
  text-align: left;
  transition: all .3s ease;
}
.ofrecemosList ul {
  position: relative;
  transition: all .3s ease;
}
.ofrecemosList ul::before {
  content: '';
  width: 2px;
  height: 100%;
  background: #009e88;
  background-color: #009e88;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  transition: all .3s ease;
}
.ofrecemosList ul li {
  padding: 10px 0 10px 15px;
  position: relative;
  transition: all .3s ease;
}
.ofrecemosList ul li::before {
  content: '';
  width: 9px;
  height: 9px;
  border-radius: 100%;
  background: #009e88;
  background-color: #009e88;
  position: absolute;
  top: 0;
  left: -3px;
  bottom: 0;
  margin: auto;
  z-index: 2;
  transition: all .3s ease;
}
.ofrecemosList ul li a {
  font-family: 'Rounded Elegance';
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  color: #ababab;
  transition: all .3s ease;
}
.ofrecemosList ul li a:hover {
  color: #f2a649;
}
.ofrecemosImg {
  max-width: 100%;
  height: auto;
  position: absolute;
  top:50px;
  right: 10%;
  bottom: 0;
  margin: auto;
  transition: all .3s ease;
}
.ofrecemosInfo {
  width: 100%;
  height: auto;
  position: relative;
  padding: 0 0 15px 0;
  text-align: left;
  transition: all .3s ease;
}
.ofrecemosInfo p {
  font-family: 'Metropolis';
  font-size: 16px;
  color: #009e88;
  font-weight: normal;
  font-style: normal;
  transition: all .3s ease;
}
/*  */

/* INICIO RESPONSIVO */
.introPicture {
  width: 100%;
  text-align: right;
  padding: 0 0 0 30%;
  display: none;
  line-height: 0;
  transition: all .3s ease;
}
.introPicture img {
  max-width: 100%;
  height: auto;
  position: relative;
  transition: all .3s ease;
}
/*  */

/* Ofrecemos certificaciones en: */
.ofrecemosPicture {
  width: 100%;
  text-align: center;
  padding: 0 15% 25px 15%;
  display: none;
  line-height: 0;
  transition: all .3s ease;
}
.ofrecemosPicture img {
  max-width: 100%;
  height: auto;
  position: relative;
  transition: all .3s ease;
}
/*  */