@charset "utf-8";

html {

  height: 100%;
}

body {
display: block;
position: absolute;  
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
top: 0;
left: 0px;
right: 0px;
bottom: 0px;
width: 100%;
height: 100%;  
margin: 0px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
padding-left: 4%;
padding-right: 0px;
padding-bottom: 0px;   
font:  "Lato", sans-serif; /* 400 15px/1.8*/
font-size: 22px;
background-color: #FFFFFF;
/*border: 3px solid #4249a9;*/
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;

} /*#cuerpo { background-color: rgba(235, 235, 235, 1); }*/


/* -------     Inicia Área Fija Superior    ------- */


#fijo_sup {
  display: flex;
  z-index: 1000;
  position: fixed;
  float: none;
  top: 0;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;  
  width: 100%;
  height: 136px;
  padding-bottom: 0px;
  padding-left: 0%;
  padding-right: 0px;
  opacity: 1;
  background-color: #FFFFFF;         
  /*border: 1px solid #0f00e6;*/
}

/* -------     Incia Caja Superior    ------- */

#caja_sup {
  display: block;
  box-sizing: border-box;
  height: 136px;
  width: auto;
  padding-left: 0px;
  overflow: hidden;
  background-color: #FFFFFF;
  /* background: rgba(63, 159, 144, 1); */
}

/* -------     Inicia Barra Vertiroja    ------- */


div.barra_verti_roja {
  display: block;
  box-sizing: border-box;
  height: 136px;
  width: 3.8%;
  padding: 0px;
  overflow: hidden;
  background-color: #C00000;
  /* border: 1px solid #C00000; */
}

/* -------     Inicia Logo Crescenti    ------- */

#logo_ByF {
    display: block;
    position: relative;
    float: left;
    height: 52px; /* 52px; */
    width: auto; /* 15%; */
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 0px;
}

#logotipo {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 0px;
    width: 100%;
    height: 136px;
}

#a_logo {  
  display: -webkit-flex; /* Chrome, Safari */
  display: -ms-flex; /* IE 10 */
  display: -moz-flex; /* Mozilla FireFox */
  display: -o-flex; /* Opera */
  display: flex;  
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;  
  -webkit-align-items: center;
  -moz-align-items: center;
  -o-align-items: center;
  -ms-align-items: center;
  align-items: center;
  position: relative;
  float: left;
  height: 136px; /* 52px; */
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-align-items: border-box;
  -o-align-items: border-box;
  -ms-align-items: border-box;
  box-sizing: border-box;
  padding: 10%;
  background: #ffffff;
}

#mini_logo {
  display: block;
  position: relative;
  float: left;    
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 136px;
  width: auto;
  padding: 0px;  
  background: #ffffff;
  background-color: solid #ffffff;
  z-index: 1000;
 /* border: 4px Solid rgb(251, 255, 4); */
}

/* -------     Finaliza Logo ByF    ------- */

/* -------    Fin del Área Fija Superior    ------- */

/* -------     Inicia Carcasa para PCs    ------- */

#marco {
  z-index: -100;
  display: block;
  box-sizing: border-box;
  height: 100%;
  padding-left: 4%;
  background-color: #C00000;
  /*border: 1px solid #f58607;*/

}


section.fondo_blanco {
  z-index: 900;
  background-color: #ffffff;
}

#portada {
  z-index: 900;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  margin: 0px;
  width: 100%;
  height: auto;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 10%;
  padding-left: 0px;
  padding-right: 0px; 
  /*border: 1px solid #000000;*/
  background-color: solid #ffffff;
  backface-visibility: visible;
  }

#rojo {
  color: #C00000;
}

#BF {
display: block;
box-sizing: border-box;
margin-top: 1em;
margin-left: auto;
margin-right: auto;
width: 100%;
color: #C00000;
font-size: 3.3em;
text-align: center;
}

.raya1 {
    width: 46%;
    margin-left: auto;
    margin-right: 4%;
    margin-bottom: 0.4%;
    border: 3px solid #920000;
}

.raya2 {
  width: 36%;
  margin-top: 0px;
  margin-bottom: 0.4%;
  margin-left: auto;
  margin-right: 4%;
  border: 2px solid #C00000;
}

.raya3 {
  width: 26%;
  margin-top: 0px;
  margin-left: auto;
  margin-right: 4%;
  border: 1px solid #E60000;
}

#solu {
  display: block;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: 10%;
  color: #000000;
  font-size: 2.3em;
  text-align: center;
  }

.areas {
display: block;
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
width: 100%;
padding-left: 22%;
color: #000000;
font-size: 1.1em;
text-align: left;
}

.lista {
    display: block;
    box-sizing: border-box;
    margin: 0px;
    padding: 0px;
}

.serv {
display: block;
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
width: 100%;

color: #000000;
font-size: 1.5em;
text-align: left;
}

.dorado {
color: #FFDE59;
}

.grisaseo {
color: #D9D9D9;
}


#contacto1 {
  display: block;
  box-sizing: border-box;
  background-color: solid #ffffff;
}

#contacto2 {
  display: block;
  box-sizing: border-box;
  background-color: solid #ffffff;
}

/* -------------------------------------------------------------------------- */






  /* -------     Inicia Cinta 1 para PCs    ------- */
  
  #cinta_1 {
    float: left;  
    display: -webkit-flex; /* Chrome, Safari */
    display: -ms-flex; /* IE 10 */
    display: -moz-flex; /* Mozilla FireFox */
    display: -o-flex; /* Opera */
    display: flex;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
    justify-content:space-around;
    -webkit-align-items: center;
    -moz-align-items: center;
    -o-align-items: center;
    -ms-align-items: center;
    align-items: center;
    width: 75%;
    height: 52px;
    padding-left: 2%;
    background: rgba(63, 159, 144, 1);
    font-size: 30px;
    font-weight: bolder;
  }
  
  /*
  @supports (background: rgba(187,31,53, 0.8)) {
    #cinta_1 {
      background: rgba(187,31,53, 0.8);
    }
  }
  */


section#contacto {

  display: flex;
  flex-direction: column;
  align-items: left;
  justify-content: space-around;
  position: relative;
  margin-top: 1%;
}

#soc1 {
  display: block;
  box-sizing: border-box;
  padding: 0;
  color: #000000;

}
  
section#contacto2 {
  display: flex;
  flex-direction: column;
  align-items: right;
  justify-content: space-around;
  position: relative;
  margin-top: 1%;
}

  #soc2 {
    display: block;
    box-sizing: border-box;
    margin-right: 1%;
    padding: 0;
    color: #000000;
    text-align: right;

  }

  #escribenos {
    display: flex;
    display: -webkit-flex; /* Chrome Safari */
    display: -moz-flex; /* Mozilla FireFox */
    display: -o-flex; /* Opera */
    display: -ms-flex; /* IE 10 */
    align-items: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -o-align-items: center;
    -ms-align-items: center;
    height: 52px;
  }
  
  a:link {
    text-decoration: none;
  }
  a:hover {
    text-decoration: none;
  }
  a:visited {
    text-decoration: none;
  }
  
  #anclacorreo, .anclacorreo, #dircorreo, #correo {
    text-decoration: none;
    color: #000000;
  }
  
  #anclacorreo:hover, .anclacorreo:hover, #correo:hover {
    text-decoration: none;
    color: rgba(176, 246, 236, 1);
  }
  
  #em_raul {
    margin-right: 1%;
    text-align: right;
  }

  #anclacorreo2, .anclacorreo2, #dircorreo2, #correo2 {
    text-decoration: none;
    color: #000000;
    text-align: right;
  }

  #cel_raul {
    margin-right: 1%;
    text-align: right;
  }
  #anclacorreo2:hover, .anclacorreo2:hover, #correo2:hover {
    text-decoration: none;
    color: rgba(176, 246, 236, 1);
  }

  #anclacel, .anclacel, #numcel, #cel {
    text-decoration: none;
    color: #000000;
  }
  
  #anclacel:hover, .anclacel:hover, #cel:hover {
    text-align: right;
    text-decoration: none;
    color: rgba(176, 246, 236, 1);
  }
  

  #anclacel2, .anclacel2, #numcel2, #cel2 {
    text-decoration: none;
    color: #000000;
  }


  #anclacel2:hover, .anclacel2:hover, #cel2:hover {
    text-align: right;
    text-decoration: none;
    color: rgba(176, 246, 236, 1);
  }


  /* -------     Finaliza Cinta 1 para PCs    ------- */
  
  /* -------     Inicia Barra de Redes Sociales Facebook, Twitter, Instagram, WhatsApp, etc.    ------- */
  
  #rs1 {
    position: relative;
    float: right;
    display: flex;
    display: -webkit-flex; /* Chrome Safari */
    display: -moz-flex; /* Mozilla FireFox */
    display: -o-flex; /* Opera */
    display: -ms-flex; /* IE 10 */
    flex-direction: row;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -o-flex-direction: row;
    -ms-flex-direction: row;  
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    align-items: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -o-align-items: center;
    -ms-align-items: center;
    width: 10%;
    height: 52px;
    background: rgba(63, 159, 144, 1);
  }
  
  /*
  @supports (background: rgba(187,31,53, 0.8)) {
    #rs1 {
        background: rgba(187,31,53, 0.8);
    }
  }
  */
  
  #facebook1 {
    display: block;
    position: relative;
    box-sizing: border-box;
    float: left;
    margin-left: 0;
    margin-right: 0%;
    padding-left: 20%;
    padding-right: 5%;
    /* border: 1px solid rgb(253, 198, 95); */
  }
  
  #whatsapp1 {
      display: block;
      position: relative;
      box-sizing: border-box;
      float: left;
      margin-left: 0;
      margin-right: 0%;
      padding-left: 0%;
      padding-right: 20%; 
  }
  
  #FacebookLogo1, #WhatsAppLogo1 .FacebookLogo, .WhatsAppLogo, #facebook_pie, #FacebookLogo_pie {
    display: block;
    position: relative;
    margin: 0px;
    padding: 0px;  
    width: 30px;
    height: 30px;
  }
  
  /* Fin Barra de Redes Sociales Facebook, Twitter, Instagram, WhatsApp, etc. */
  
  #rs2 {
    display: none;
  }
  
  /* Cintas A, B y C para móviles */
  
  #cinta_A, #cinta_B, #cinta_C {
    display: none;
    clear: both;
  }
  
  /* -------     Inicia Barra-Menú Adaptable     ------- */
  
  #nav {
    clear: both;
    margin-bottom: 0px;
    padding-bottom: 0px;
  }
  
  nav#nav navbar-inverse {
    display: block;
    float: none;
    width: 95%;
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
  
  }
  
  #container-fluid, .container-fluid {
    margin-bottom: 0px;
  }
  
  .navbar-header, #EncabezadoDelMenu {
    margin-bottom: 0px;
  }
  
  #miMenu, .navbar-collapse {
    margin-bottom: 0px;
  }
  
  #miMenu, #container-fluid {
    background-color: #222;
  }
  
  #nav .container-fluid .navbar-header .lema_barra_menu {
    display: none;
  }
  
  #mini_logo_barra_menu {
    display: block;
    position: relative;
    float: left;    
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 30px;
    width: auto;
    padding: 0px;  
    background: #ffffff;
    background-color: solid #ffffff;
    z-index: 1000;
    display: none;
  /* border: 4px Solid rgb(251, 255, 4); */
  }
  
  #EncabezadoDelMenu a.navbar-brand {
    background-color: #ffffff;
  }
  
  #color_letra_qs {
    color: #ffffff;
  }
  
  #color_letra_tyc {
    color: #ffffff;
  }
  
  #color_letra_capital-humano {
    color: #ffffff;
  }
  
  #color_letra_consult {
    color: #ffffff;
  }
  
  #color_letra_coach {
    color: #ffffff;
  }
  
  #color_letra_ayh {
    color: #ffffff;
  }
  
  #color_letra_info {
    color: #ffffff;
    font-size: 30px;
  }
  
  #color_letra_qs:hover {
    color: #3F9F90;
    color: rgba(63, 159, 144, 1); 
  }
  
  #color_letra_tyc:hover {
    /* background: #36454d; */
    color: #3F9F90;
    color: rgba(63, 159, 144, 1);
    /*font-weight: bold;*/
  }
  
  #color_letra_consult:hover {
    
    color: rgba(63, 159, 144, 1);
    /*font-weight: bold;*/
  }
  
  #color_letra_coach:hover {
    color: #3F9F90;
    color: rgba(63, 159, 144, 1);
    /*font-weight: bold;*/
  }
  
  #color_letra_ayh:hover {
    color: #3F9F90;
    color: rgba(63, 159, 144, 1);
  }
  
  #color_letra_info:hover {
    color: #3F9F90;
    color: rgba(63, 159, 144, 1);
  }
  
  /* -------     Finaliza Barra-Menú Adaptable    ------- */