/*Inicio espacio para las fuentes*/
@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Rubik";
  src: url("../../../fonts/Rubik-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}


@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../../../fonts/AlbertSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../../../fonts/Montserrat-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}


@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Mulish";
  src: url("../../../fonts/Mulish-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Nunito";
  src: url("../../../fonts/Nunito-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "SofiaSans";
  src: url("../../../fonts/SofiaSans-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "SofiaSans";
  src: url("../../../fonts/SofiaSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "SofiaSans";
  src: url("../../../fonts/SofiaSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "SofiaSans";
  src: url("../../../fonts/SofiaSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
/*fuente poppins*/
@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
  
@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("../../../fonts/Poppins-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
/*fin poppins*/

@font-face {
        font-family: 'iconos-sistel';
        src: url('../../../public/font/font_sistel/iconos-sistel.eot?41096833');
        src: url('../../../public/font/font_sistel/iconos-sistel.eot?41096833#iefix') format('embedded-opentype'),
           url('../../../public/font/font_sistel/iconos-sistel.woff?41096833') format('woff'),
           url('../../../public/font/font_sistel/iconos-sistel.ttf?41096833') format('truetype'),
           url('../../../public/font/font_sistel//iconos-sistel.svg?41096833#iconos-sistel') format('svg');
        font-weight: normal;
        font-style: normal;
    }

/*Fin espacio para las fuentes*/ 

/*Inicio estilos generales*/
  body {
    font-family: 'SofiaSans';display: flex;min-height: 100vh;flex-direction: column;
  }

  main, div.page-wraper {
    flex: 1 0 auto;
    /*background-color: #FFFFFF;*/
  }

  html, body {
    width: 100% !important;font-size: 17px;
  }

  a:link, a:visited, a:active {
    text-decoration:none;
  }

  .header-front {
    width: 100%;
    display: flex;
    position: relative;
    border-bottom: 4px solid #0C2249;
    background-color: #0C2249;
  }

  .my-container {
    margin: 0 auto;width: 70%;
  }
  
  .credito-footer {
    top: 5px;position: relative;
  }

  .credito-footer {
    top: 0em;
  }

  /*footer de soy formador*/
  .footer-fondo-color {
    bottom: 0px;
    z-index: 1;
    border-top: 4px solid #000000;
    background-color: #000000;
    width: 100%;
    margin-right: 0 auto;
    margin-top: 70px;
  }

  .pie-fondo-color {
    padding-top: 15px;
    font-size: 8px;
    color: #F9F9F9;
    font-weight: 400;
  }
  /*footer de soy formador*/
  footer {
    background: #000000;color: #F9F9F9;font-size: 10px;
  }
  .link-footer{
    color: #ffffff;
  }
  
  .link-footer:hover {
    color: #ffffff;
  }

  footer .row {
    margin-bottom: 0;
  }

  .iconos-footer {
    position: relative;
    left: 0;
    bottom: 35px;
    height: 0;
  }

  .enlaces-iconos-footer {
    display: inline-block;
  }
  .page-wraper {
    width: 100%;display: flex;
    background-color: #ffffff;
    /*margin-block-end: -25px; quitar el espacio entre el body y el footer*/
  }

  #my-iframe {
    width: 100%;height: 790px;
  }

  .error {
    color: #EA4646;
  }
  
  .titulos-header-cursos {
    width: 100%;
    margin: 0 auto;
    height: auto;
    display: flex;
    background: #29abe2;
  }
  
  .titulos-header-cursos .titulos-header {
    font-weight: 700;
    font-size: 22px;
    color: #FFFFFF;
    padding: 11px;
    padding: 11px 40px 11px 20px;
    white-space: nowrap;
  }

 .texto_menu {
    line-height: 80%;
    font-size: 1em;
  }
  
  .titulos-header-cursos .subtitulo-seccion {
    width: 100%;background: #CFE1E5;border-bottom-left-radius: 3em;
  }
  
  .titulos-header span {
    font-weight: 700;
    font-size: 1.4em;
    color: #FFFFFF;
    margin-left: 30px;
  }

  .subtitulos-header {
    margin-left: 30px;
  }
  
  .subtitulos-header span {
    font-size: 1.2em;color: gray;
  }

  .alert-danger {
    color: #a94442;background-color: #f2dede;border-color: #ebccd1;
  }
  
  .alert {
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid transparent;
    border-radius: 4px;
  }
  
  .alert-success {
    color: #006241;background-color: #dff0d8;border-color: #d6e9c6;
  }

  .color-title-form {
    /*color: #000000; */font-weight:700;
  }
  
  .color-mensaje-span {
    color: #bdc2c9;
  }

  #message-green, .toast-succes {
    background-color: #41631C;color: #F9F9F9;
  }
  
  #message-yellow, .toast-warning {
    background-color: #f0ad4e;color: #F9F9F9;
  }
  
  #message-red, .toast-error {
    background-color: #d9534f;color: #F9F9F9;
    padding: 0px 20px;
  }
  
  #message-blue, .toast-info {
    background-color: #0275d8;color: #F9F9F9;
  }

  .input-field div.error {
    position: relative;
    top: -1rem;
    left: 0rem;
    font-size: 17px;
    color: #000000;
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }

  /*Inicio miga de pan*/
  .submenu{
    display: flex;
    align-items: center;
    margin-bottom: 3em;
    margin-top: 1em;
  }
  .mybread {
    box-shadow: none;
  }
  
  .mybread .breadcrumb:before {
    color: inherit;
  }
  
  .breadcrumb {
    margin-top: 0px;
    margin-bottom: 0px;
    color: #000000;
    background-color: #fff;
    border: 0px;
    padding: 0rem;
    align-items: center;
  }

  .breadcrumb .breadcrumb-item .active{
    color: #a59f9f;
      border-bottom: 2px solid;
  }

  .link_p, 
  .link_p:hover,
  .breadcrumb a,
  .breadcrumb a:hover {
    text-align: left;
    color: #000000;
    font-size: 18px;
    text-decoration: none;
    font-weight:700;
  }
  /*Fin miga de pan*/
  
  .btn, .btn-large {
    /*background-color: #29abe2;*/
    font-weight: 500;
    text-transform: none;
    /*color: #fff; comentado porque se usa para los botones de calificacion de contenido*/
    border-radius: 16px;
    width: 110px;
    font-weight: 600 !important;
  }
  
  .btn:hover, .btn-large:hover,
  .btn:focus, .btn-large:focus,
  .btn:active, .btn-large:active  {
    /*background-color: #29abe2;*/
    /*color: #fff; comentado porque se usa para los botones de calificacion de contenido*/
    font-weight: 500;
    text-transform: none;
    border-radius: 16px;
    font-weight: 600 !important;

  }
  
  
  .btn2, .btn-large2 {
    /*background-color: #000000;*/
    font-weight: 500;
    text-transform: capitalize;
    color: #fff;
    border-radius: 0px;
  }
  .btn2:hover, .btn-large2:hover,
  .btn2:focus, .btn-large2:focus,
  .btn2:active, .btn-large2:active
   {
    /*background-color: #000000;*/
    font-weight: 500;
    text-transform: capitalize;
    color: #fff;
    border-radius: 0px;
  }

  input:not([type]):focus:not([readonly])+label, input[type=text]:not(.browser-default):focus:not([readonly])+label, input[type=password]:not(.browser-default):focus:not([readonly])+label, input[type=email]:not(.browser-default):focus:not([readonly])+label, input[type=url]:not(.browser-default):focus:not([readonly])+label, input[type=time]:not(.browser-default):focus:not([readonly])+label, input[type=date]:not(.browser-default):focus:not([readonly])+label, input[type=datetime]:not(.browser-default):focus:not([readonly])+label, input[type=datetime-local]:not(.browser-default):focus:not([readonly])+label, input[type=tel]:not(.browser-default):focus:not([readonly])+label, input[type=number]:not(.browser-default):focus:not([readonly])+label, input[type=search]:not(.browser-default):focus:not([readonly])+label, textarea.materialize-textarea:focus:not([readonly])+label {
    color: #000000;
  }

  input:not([type]):focus:not([readonly]), input[type=text]:not(.browser-default):focus:not([readonly]), input[type=password]:not(.browser-default):focus:not([readonly]), input[type=email]:not(.browser-default):focus:not([readonly]), input[type=url]:not(.browser-default):focus:not([readonly]), input[type=time]:not(.browser-default):focus:not([readonly]), input[type=date]:not(.browser-default):focus:not([readonly]), input[type=datetime]:not(.browser-default):focus:not([readonly]), input[type=datetime-local]:not(.browser-default):focus:not([readonly]), input[type=tel]:not(.browser-default):focus:not([readonly]), input[type=number]:not(.browser-default):focus:not([readonly]), input[type=search]:not(.browser-default):focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #000000;
    -webkit-box-shadow: 0 1px 0 0 #000000;
    box-shadow: 0 1px 0 0 #000000;
  }
  
  .mb-0 {
    margin-bottom: 0 !important;
  }

  .avatar-usuario {
    max-width: max-content;margin-bottom: 10px;width: 100%;
  }
  
  .contenedor-opciones-ml {
    margin-top: 40px;
  }
  
  .contenedor-opciones-ml a {
    display: block;
    margin: 7px 0;
    padding: 10px;
    text-align: left;
    font-size: 18px;
    font-family: Rubik-ExtraLight;
  }
  
  .text-center {
    text-align: center !important;
  }
  
  .text-alert {
    text-align: center !important;font-size: 13px;margin-top: -25px
  }
  
  .alert-dismissible {
    top: 0;
    right: 0;
    padding: .3rem .3rem;
    color: inherit;
  }

  .container-fluid {
    margin-top: 0px;
    width: 100%;
    height: 100%;
    padding: 0 15px;
    max-width: 2000px;
  }


  @media screen and (min-width: 1309px) and (max-width: 1434px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 16px;
      text-decoration: none;
      font-weight:700;
    }

  }
  @media screen and (min-width: 1184px) and (max-width: 1308px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 14px;
      text-decoration: none;
      font-weight:700;
    }
  }
  
  @media screen and (min-width: 1059px) and (max-width: 1183px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 12px;
      text-decoration: none;
      font-weight:700;
    }

  }
  
  @media screen and (min-width: 996px) and (max-width: 1058px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 11px;
      text-decoration: none;
      font-weight:700;
    }
  }
  
  @media screen and (min-width: 845px) and (max-width: 995px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 9px;
      text-decoration: none;
      font-weight:700;
    }
    .breadcrumb-item+.breadcrumb-item {
      padding-left: 0.2rem;
    }
  }
  @media screen and (min-width: 768px) and (max-width: 844px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 7px;
      text-decoration: none;
      font-weight:700;
    }
    
    .breadcrumb-item+.breadcrumb-item {
      padding-left: 0.2rem;
    }
  }

  
  @media screen and (min-width: 579px) and (max-width: 767px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 11px;
      text-decoration: none;
      font-weight:700;
    }
    
    .breadcrumb-item+.breadcrumb-item {
      padding-left: 0.2rem;
    }
  }
  
  @media screen and (min-width: 300px) and (max-width: 578px) {
    .link_p, 
    .link_p:hover,
    .breadcrumb a,
    .breadcrumb a:hover {
      text-align: left;
      font-size: 10px;
      text-decoration: none;
      font-weight:700;
    }
    .breadcrumb-item+.breadcrumb-item {
      padding-left: .1rem;
    }
  }

  @media (max-width: 550px) {
    .subtitulo-seccion {
      display: none;
    }
    .titulos-header-cursos {
      display: block;
    }
  }

  @media (max-width: 400px) {
    #my-iframe {
      height: 1250px;
    }
  }
  
  .hoverable:hover{
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    transition: transform .5s;
  }

  form label {
        color: #000000;
        font-weight: 400;
        font-size: 0.9rem;
        margin-bottom: 0.1rem;
    }

  .subtitle-form{
    font-weight:700;color:#000000;font-size: 2rem;
  }
  
    .miga {
    margin-left: 40px;margin-top: 20px;text-align: left;
  }

  .texto_info {
    background-color:#fefeff; /*#e3e2e4;*/
    color: #000000;
    font-weight: 400;
    font-size: 16px;
    padding-top: 8px;
    text-align: justify;
    box-shadow: rgb(0 0 0 / 15%) 0px 2px 8px;
    margin-top: 21px;
  }

  .texto_info > p{
    margin: 0;
  }

  .msg-container {
    max-width: 800px;
    min-height: 125px;
    border: 5px solid #b3b3b3 ;
    border-radius: 20px;
    margin: 0 auto;
    padding: 20px;
  }

  .msg-container span {
    margin: 0 auto; 
    font-size: 25px; 
    font-weight: 500;
    color: #000000;
  }
/*Fin estilos generales*/

/*Inicio estilos menu*/
  /*menu principal*/
  .menuhidden {
    background: #fff;/*transparent;*/
    position: fixed;
    z-index: 100;
    width: 13% !important;
    flex-grow: 1;
    justify-content: center;
    align-items: center;
    flex-flow: row wrap;
    margin-left: 32%;
    top:124px;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
  }

  .button-menu:hover{
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1);
        transition: transform .5s;
    }
  .button-menuder{
    text-align: left;position: relative;width: 100%;
  }

    .button-menuder:hover{
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1);
        transition: transform .5s;
    }
  
  @media screen and (min-width: 1765px) and (max-width: 1814px) {
    .menuhidden {
      width: 14% !important;margin-left: 34%;
    }
  }
  @media screen and (min-width: 1717px) and (max-width: 1764px) {
    .menuhidden {
      width: 14% !important;margin-left: 34%;
    }
  }
  @media screen and (min-width: 1670px) and (max-width: 1716px) {
    .menuhidden {
      width: 14% !important;margin-left: 35%;
    }
  }
  @media screen and (min-width: 1612px) and (max-width: 1669px) {
    .menuhidden {
      width: 15% !important;margin-left: 36%;
    }
  }

  @media screen and (min-width: 1580px) and (max-width: 1611px) {
    .menuhidden {
      width: 16% !important;margin-left: 37%;
    }
  }
  @media screen and (min-width: 1520px) and (max-width: 1579px) {
    .menuhidden {
      width: 16% !important;margin-left: 38%;
    }
  }
  @media screen and (min-width: 1495px) and (max-width: 1519px) {
    .menuhidden {
      width: 17% !important;margin-left: 39%;
    }
  }

  @media screen and (min-width: 1470px) and (max-width: 1494px) {
    .menuhidden {
      width: 17% !important;margin-left: 40%;
    }
  }
  @media screen and (min-width: 1424px) and (max-width: 1469px) {
    .menuhidden {
      width: 17% !important;margin-left: 41%;
    }
  }
  @media screen and (min-width: 1390px) and (max-width: 1423px) {
    .menuhidden {
      width: 18% !important;margin-left: 42%;
    }
  }

  @media screen and (min-width: 1355px) and (max-width: 1389px) {
    .menuhidden {
      width: 19% !important;margin-left: 43%;
    }
  }

  @media screen and (min-width: 1330px) and (max-width: 1354px) {
    .menuhidden {
      width: 19% !important;margin-left: 44%;
    }
  }
  @media screen and (min-width: 1295px) and (max-width: 1329px) {
    .menuhidden {
      width: 19% !important;margin-left: 45%;
    }
  }
  @media screen and (min-width: 1267px) and (max-width: 1294px) {
    .menuhidden {
      width: 18% !important;margin-left: 46%;
    }
  }
  @media screen and (min-width: 1240px) and (max-width: 1266px) {
    .menuhidden {
      width: 17% !important;margin-left: 47%;
    }
  }
  @media screen and (min-width: 1214px) and (max-width: 1239px) {
    .menuhidden {
      width: 17% !important;margin-left: 48%;
    }
  }

  @media screen and (min-width: 1190px) and (max-width: 1213px) {
    .menuhidden {
      width: 16% !important;margin-left: 49%;
    }
  }
  @media screen and (min-width: 1160px) and (max-width: 1189px) {
    .menuhidden {
      width: 19% !important;margin-left: 49%;
    }
  }
  @media screen and (min-width: 1111px) and (max-width: 1159px) {
    .menuhidden {
      width: 17% !important;margin-left: 49%;
    }
  }

  @media screen and (min-width: 1080px) and (max-width: 1110px) {
    .menuhidden {
      width: 14% !important;margin-left: 52%;top: 99px;
    }
  }

  @media screen and (min-width: 1059px) and (max-width: 1079px) {
    .menuhidden {
      width: 16% !important;margin-left: 50%;top: 99px;
    }
  }

  @media screen and (min-width: 1028px) and (max-width: 1058px) {
    .menuhidden {
      width: 16% !important;margin-left: 50%;top: 99px;
    }
  }

  @media screen and (min-width: 993px) and (max-width: 1027px) {
    .menuhidden {
      width: 16% !important;margin-left: 50%;top: 106px;
    }
  }
  /*menu principal*/
  /*menu responsive*/
  nav {
    width: 100%;
    background-color: #fff;   
    margin-top: 5px;
    text-align: left;
    box-shadow: unset;
  }

  .side-nav .user-view .mybackground {
    background-color: #e07710;
  }
  #slide-out .user-view {
    background: #000000;
  }
  
  #slide-out .user-view .circle {
    width: 100px;
    height: auto;
    margin: 0 auto;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
  #sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    left: 250px;
    width: 0;
    height: 100%;
    margin-left: -250px;
    overflow-y: auto;
    background: transparent;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  }
  .header-front.toggled #sidebar-wrapper {
    width: 250px;
  }
  .side-nav {
    background-color: #fff;
    position: absolute;
    top: 0;
    width: 250px;
    margin: 0;
    padding: 0;
    list-style: none;
    }
   .side-nav li > a {
     color: #fff;
     display: flex;
     align-items: center;
     font-size: 15px;
     font-weight: 500;
     padding: 5px 32px;
     background-color: #0a2d46;
     font-weight: 400;
   }
   .side-nav i.demo-icon {
     font-size: 2rem;color: #fff;
   }
   
   .side-nav li > a:hover,
   .side-nav li > a:focus,
   .side-nav li > a:active {
     color: #ffffff;
     /*display: block;*/
     display: flex;
     align-items: center;
     font-size: 15px;
     /*font-weight: 500;*/
     /*height: 48px;*/
     /*line-height: 50px;*/
     padding: 5px 32px;
     background-color: #d0cece;
     font-weight: 400;
     
   }
   .side-nav i.demo-icon:hover,
   .side-nav i.demo-icon:focus,
   .side-nav i.demo-icon:active {
     font-size: 2rem;color: #000000;
   }

   .side-nav a {
    text-decoration: none;
  }

  .side-nav i.demo-icon {
    font-size: 2rem;
  }
   /*menu responsive*/
   .menu-desktop {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: start;
    margin-top: 0px;
  }

/*Fin estilos menu*/
/*Inicio estilos menu desplegable del usuario*/
  #dropdown-info-usuario {
    min-width: 250px;
    max-height: 700px;
    overflow-y: auto;
    width: 11rem !important;
  }

  #dropdown-info-usuario a{
    display: block;
    line-height: 22px;
    padding: 14px 16px;
    font-weight: 400;
    font-size: 0.9em;
  }

  #dropdown-info-usuario .btn-info-sidebar{
    color: #000000 !important;
    background-color: #fff;
  }

  #dropdown-info-usuario .btn-info-sidebar:hover,
  #dropdown-info-usuario .active,
  .btn-info-sidebar[aria-expanded="true"] {
    color: #fff !important;
    background-color: #D63C3C !important;
  }

  #dropdown-info-usuario #collapse-info-more-option > a{
    color: #fff;
    background-color: #D63C3C;
    padding-left: 40px;
  }

  #dropdown-info-usuario #collapse-info-more-option > a:hover{
    color: #000000;
    background-color: #fff;
  }

  #dropdown-info-usuario i {
    font-size: 1.2rem !important;
  }

  .nombre_usuario{
    font-weight:700 !important;
    color: #000000 !important;
  }

  .cargo_usuario{
    font-weight: 400 !important;font-size: 0.8em !important;color: #000000 !important;
  }

  .dropdown .dropdown-toggle:not(.drop-foro)::after{
    content: "\f054";
      font-family: FontAwesome;
    transition-duration: 1s;
    border: 0;
    color: #b5b5ba;
    font-size: 12px;
  }
  .dropdown .dropdown-toggle:not(.drop-foro)[aria-expanded="true"]::after,
  .accordion-header[aria-expanded="true"] .rotate-right-arrow{
    transform: rotate(90deg);
    transition-duration: 1s;
  }
  .rotate-right-arrow{
    position: absolute;
    right: 10px;
  }
  .btn-info-sidebar::after {
    float: right;
  }
/*Fin estilos menu desplegable del usuario*/
/*Inicio estilos header_front-view*/
  .espacio {
    margin-left: 1.5rem!important
  }

  .perfil {
    font-weight: 500;
    font-size: 0.7em;
    color: #FFFFFF;
    margin-bottom: 0rem;
    text-align: center;
  }

  #content-notification{
    max-height:300px;
  }

  #imagen_menu{
    vertical-align: middle
  }
  .clear-file{
        position: absolute;
        right: 8px;
        font-size: 1.5em;
    }

/*Fin  estilos header_front-view*/
/*Inicio estilos home*/
  .card{
    border: none;
    /*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;*/
    box-shadow:rgb(0 0 0 / 66%) 0px 1px 9px;
    border-radius: 14px;
    background-color: #ffffff;
  }

  .card-gray{
    background: #e8edef !important;
  }

  .card-sesion{
    margin: 0;
    align-items: center;
    padding: 10px;
    background-color: #e8edef;
    border-radius: inherit; /* fix */
  }
  .card-sesion .card-text{
    text-align: left;
      width: 60%;
  }
  .card-sesion .card-image{
    width: 40%;
    display: flex;
    align-items: center;
    justify-content: end;
  }
  .card-sesion .card-image,
  .card-sesion .card-image > img{
    border-radius: 0 0.25rem 0.25rem 0;
  }
  .card-generic .card-body{
    max-height: 170px;
    line-height: 20px;
  }
  .texto1 {
    font-weight: 700;font-size: 1em;color: #000000;
  }

  .texto-bienvenida {
    font-weight:600;
    font-size: 2.5em;
    color:#0a2d46;
    line-height: 32px; /*interlineado*/
  }

  .progress-course>.total_curso {
    text-align: right;font-size: 14px;margin-right: 20px;
  }

  .porcentaje_progreso {
    color: #EAEAEA;
    font-size: 17px;
    text-align: center;
  }

  .progress-course .progress {
    height: 30px;
    background-color: #e8edef;
  }

  .progress {
    position: relative;
    height: 4px;
    width: 100%;
    border-radius: 30px;
    margin: 0.5rem 0 1rem 0;
    overflow: hidden;
  }

  .progress .progress-bar {
    background-color: #E5BC0E;
  }
    
  span.promedio {
    /*color: #000000;*/
    font-weight:700;
  }
  
  span.logros{
    /*color: #29abe2;*/
    font-weight:700;
  }

  .dark_text {
    color: #000000;
    text-align: left;
    font-weight:500;
    
  }
  .f-siz-16{
      font-size: 16px;
  }
  @media (max-width: 992px) {
    
    .contenido {
      width: 100%;
    }
    .my-container {
      margin: 0 auto;width: 100%;
    }
  }

  .texto_total1 {
      color: #000000;
      font-weight: 500;
      font-size: 1em;
    }

    .como_funciona{
      font-size: 33px;
    }
    
  .texto_total2 {
      color: #e9ecf2;
      font-weight: 400;font-size: 0.78em;
    }
  @media screen and (min-width:1301px)and (max-width:1416px) {
    .texto_total1 {
      font-weight: 400;font-size: 1em;
    }
  }
  @media screen and (min-width:1201px)and (max-width:1300px) {
    .texto_total1 {
      font-weight: 400;font-size: 1em;
    }
  }
  @media screen and (min-width:1101px)and (max-width:1200px) {
    .texto_total1 {
      font-weight: 400;font-size: 0.9em;
    }
  }
  @media screen and (min-width:992px)and (max-width:1100px) {
    .texto_total1 {
      font-weight: 400;font-size: 0.9em;
    }
  }

  @media screen and (min-width:145px)and (max-width:430px) {
    .texto_total1 {
      font-weight: 400;font-size: 0.9em;
    }
  }

  .titulo_disclaimer{
    color: #1450c9;
    font-weight: 700;
  }
  .texto_disclaimer{
      color: #1450c9;
      font-weight: 400;
      font-size: 1em;
      text-align: justify !important;
    }
    
  .btn_dis, .btn_dis:hover{
    color: #fff;
    background: #009490;
    font-weight: 600;
    font-size: 1em;
  }

  .btn_dis_no, .btn_dis_no:hover{
    color: #fff;
    background: #E5102F;
    font-weight: 600;
    font-size: 1em;
  }

/*Fin estilos home*/

/*Inicio estilos actualizar datos*/
  .explorar, .explorar:hover {
    background-color: #e07710;
    border: 0;
    color: #fff;    
    padding: 0px 0px;
    font-weight: 500;
    text-transform: capitalize; 
    width: 50%;
    text-align: center;
    margin-left: 0px;
    margin-bottom: 0px;
    height: 3em;
    font-size: 0.9em;
  }
/*Fin estilos actualizar datos*/

/*Inicio estilos actualizar contraseña*/
  .mensaje-info{
    color:#000000; font-weight: 400;font-size: 1em;
  }
/*Fin estilos actualizar contraseña*/
/*Inicio estilos soporte y ayuda*/
  .contenido-soporte{
    float: none; width: 100%;
  }
/*Fin estilos soporte y ayuda*/

/*Inicio estilos ranking*/
  span.posicion{
    color: #000000;
    font-weight:900;
  }

  .logros{
    /*color: #29abe2;*/font-weight:700;
  }
  .botones_tabla  {
    font-size: 14px;
    color: #ffffff;
    text-align: center;
    font-weight: 600;
    border: 0;
    background: #cacbcc;
    width: 100%;
    margin-top: 0px;
    padding: 7px 3px;
    margin: 0px 2px;
    border-radius: 8px;
  }
  
  .botones_tabla:hover  {
    background: #0C2249;
  }

  .texto_total {
    /*color: #000000;*/font-weight: 400;font-size: 1.8em;/*font-size: 1.5em;*/
  }
  @media screen and (min-width:1301px)and (max-width:1416px) {
    .texto_total {
      font-weight: 400;font-size: 1.8em;/*font-size: 1.3em;*/
    }
  }
  @media screen and (min-width:1201px)and (max-width:1300px) {
    .texto_total {
      font-weight: 400;font-size: 1.5em;/*font-size: 1.13em;*/
    }
  }
  @media screen and (min-width:1101px)and (max-width:1200px) {
    .texto_total {
      font-weight: 400;font-size: 1.4em;/*font-size: 1.06em;*/
    }
  }
  @media screen and (min-width:992px)and (max-width:1100px) {
    .texto_total {
      font-weight: 400;font-size: 1.2em;/*font-size: 0.9em;*/
    }
  }
  @media screen and (min-width:901px)and (max-width:991px) {
    .texto_total {
      font-weight: 400;font-size: 1.6em;
    }
  }

  @media screen and (min-width:800px)and (max-width:900px) {
    .texto_total {
      font-weight: 400;font-size: 1.4em;
    }
  }
  @media screen and (min-width:768px)and (max-width:799px) {
    .texto_total {
      font-weight: 400;font-size: 1.4em;
    }
  }

  @media screen and (min-width:590px)and (max-width:767px) {
    .texto_total {
      font-weight: 400;font-size: 1.7em;
    }
  }

  @media screen and (min-width:485px)and (max-width:589px) {
    .texto_total {
      font-weight: 400;font-size: 1.4em;
    }
  }
  @media screen and (min-width:385px)and (max-width:484px) {
    .texto_total {
      font-weight: 400;font-size: 1.3em;
    }
    .text-card-cursos {
        font-size: 0.9em !important;
    }
    .texto_total1 {
        font-size: 0.9em !important;
    }
    .logo {
        height: 82px !important;
    }
  }
/*Fin estilos ranking*/

/*Inicio estilos evaluaciones y contenido*/
  .question {
    width: 60%;
    margin: 1rem;
    text-align: left;
    padding: 1rem;
    background: #c6c7d354;
    border-radius: 5px;
    font-size: 1.05rem;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 25%);
    color:#000000
  }
  
  .info_eval{
    width: 70%;
    margin: 0.2rem;
    text-align: center;
    padding: 0.2rem;
    background: #000000;
    border-radius: 5px;
    font-size: 0.9rem;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
    color:#fff;
    font-weight: 700;
  }
  
  .info_correcta{
    width: 80%;
    margin: 0.2rem;
    text-align: center;
    padding: 0.2rem;
    background: #035525;
    border-radius: 5px;
    font-size: 0.9rem;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
    color:#fff;
    font-weight: 700;
  }
  .info_incorrecta{
    width: 80%;
    margin: 0.2rem;
    text-align: center;
    padding: 0.2rem;
    background: #db0404;
    border-radius: 5px;
    font-size: 0.9rem;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
    color:#fff;
    font-weight: 700;
  }

  .info_porcentaje{
    width: 80%;
    margin: 0.2rem;
    text-align: center;
    padding: 0.2rem;
    background: #29abe2;
    border-radius: 5px;
    font-size: 0.9rem;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
    color:#fff;
    font-weight: 700;
  }

  .info_porcentaje2{
    width: 80%;
    margin: 0.2rem;
    text-align: center;
    padding: 0.2rem;
    background: #000000;
    border-radius: 5px;
    font-size: 0.9rem;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
    color:#fff;
    font-weight: 700;
  }

  .info_eval:hover, .info_correcta:hover, .info_incorrecta:hover, .info_porcentaje:hover {
    transform: scale(1.1);
  }
  

  @media screen and (min-width:200px)and (max-width:992px) {
    .question {
      width: 100%;
    }
  }
  @media screen and (min-width:200px)and (max-width:768px) {
    .info_eval, .info_correcta, .info_incorrecta, .info_porcentaje {
      width: 100%;
    }
  }
  .num_pregunta {
    font-size: 15px;font-weight:700;color: #000000;
  }

  .resp_correcta {
    color: #09AC04;font-weight: 800;
  }

  .resp_errada {
    color: #F70707;font-weight: 800;
  }

  .icon-57{
    font-size: 1.25rem;
  }

  .name, .link, .score, .url {
    text-align: center;
    padding: 10px 23px;
    /*color: #000000;*/
    font-size: 1em;
    font-weight: 400;
  }

  .generic-table{
        width: 90%;
        margin: 0 auto;
        background-color: #fff;
        border-radius: 15px !important;
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }

  .generic-table td, .generic-table th {
    vertical-align: middle;
  }
  
  .generic-table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #DFE0E2;
    text-align: center;
  }
  
  /*.th-border{
        border-radius:87px;
    }*/

  .btnEval, .btnEval:hover, .btnEval:focus{
    cursor: pointer; margin: 0px; background-color: transparent; border: none;
  }
  .contenedort {
    z-index: 2;
    
  }
  .timer {
    display: block;
    text-align: center;
    padding: 1rem;
    position: fixed;
    bottom: 0;
    z-index: 3;
    width: auto;
    font-weight:700;
    color: #fff;
    background-color: #b3b3b3;
    border-radius: 0.25rem;
    box-shadow: rgb(0 0 0 / 35%) 0px -3px 15px;
    margin-left: 1%;
  }

  .evaluacion_titulo{
    font-weight:700;/*color:#000000;*/
  }

  .evaluacion_titulo1{
    font-weight: 500;/*color:#000000;*/
  }

  .texto_preguntas{
    color:#000000; font-weight: 500;
  }

  .sec_pregunta {
    border: 0.5px solid #000000;
    background-color: #000000;
    padding: 10px 20px;
      border-radius: 10px 10px 0 0;
    color: #FFFFFF;
  }

  .sec_respuestas {
    border-left: 0.5px solid #000000;
    border-right: 0.5px solid #000000;
    border-bottom: 0.5px solid #000000;
    padding-bottom: 10px;
    padding-top: 10px;
    margin-bottom: 10px;
    background-color: #ffffff;
    border-radius: 0 0 10px 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  }

  .sec_respuestas label {
    color: #000000;
  }

  .btn_evaluacion {
    /*background: #4495d1;*/
    border: 0;
    color: #fff;
    text-transform: uppercase;
    font-weight:700;
    text-align: center;
    text-align: center;
    margin-left: 10px;
    padding:10px 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;

  }

/*Fin estilos evaluaciones y contenido*/

/*Inicio estilos notas y certificados*/
  .textcolor1{
    /*color:#000000;*/font-weight:700;
  }

  .textcolor2{
    /*color:#000000;*/font-weight: 400;
  }

  .color-link {
    color: #ffffff;
    border: 1px solid #D63C3C;
    border-radius: 25px;
    padding: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #D63C3C;
  }

  .color-link:hover{
    color: #FFFF;
    background-color: #D63C3C;
  }

  .color-link2 {
    color: #ffffff;
    border-radius: 25px;
    padding: 10px;
    vertical-align: middle;
    align-items: center;
    display: inline-flex;
    background-color: #0C2249;
    -webkit-box-shadow: 0px 10px 7px 0px rgba(0,0,0,0.06);
    -moz-box-shadow: 0px 10px 7px 0px rgba(0,0,0,0.06);
    box-shadow: 0px 10px 7px 0px rgba(0,0,0,0.06);
  }

  .color-link2:hover{
    color: #FFF;
    background-color: #0C2249;
  }

  .color-link2-desc{
    color:#000000;
    border: 1px solid #0C2249;
    border-radius: 10px;
    padding: 6px;
    vertical-align: middle;
    align-items: center;
    display: inline-flex;
    font-weight: 600;
  }

  table.webinars {
    border-collapse: collapse;
    border-spacing: 0;
    width: 90%;
    border: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }
/*Fin estilos notas y certificados*/

/*Inicio estilos cursos y contenido*/

  .item_course {
    text-align: center;text-decoration: none; 
    /*background-color: aliceblue;
        border-radius: 12px;
        margin-left: 12px;*/
  }
  
  .item_course a {
    text-decoration: none;
  }
  
  .img_course img {
    max-width: 200px;max-height: 200px;
    background-color: #ffffff;
        border-radius: 12px;
        /* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
    
  }
  
  .img_course i {
    position: absolute;
  }
  
  .title_course { 
    margin: 0 auto;
    overflow-y: hidden;
    border-radius: 0 0 10px 10px;
    padding: 5px 0.5rem;
  }
  
  .title_course span, .title_course span:hover {
    /*color: #000000;*/
    font-weight: 500;
    font-size: 13px;
    vertical-align: middle; 
  }

  .title_course {
    display: block;
  }

  .titulos{
    /*color:#000000;*/ font-weight:700;text-align:center;
  }
  
  .enlace_examen{
    font-weight: 600;color: #000000;
  }
/*Fin estilos cursos y contenido*/

/*Inicio Examen curso*/
.rating-wrapper .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #fff;
  color: #000000;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  position: absolute;
  left: 6rem;
  z-index: 1;
  cursor: pointer;
}

.rating:hover .tooltiptext {
  visibility: visible;
}
/*Fin Examen curso*/

/*Inicio estilos notificaciones*/

  /* Inicio TK001Avisos-20220622 */
  .badge-notifications{
    margin-left: -10px !important;
    top: -7px  !important;
    border-radius: 50%;
    color: #FFFF !important;
    min-width: 1.3rem !important;
    font-size: 0.8rem !important;
    position: absolute !important;
    background-color: #b3b3b3 !important;
    border: 1px solid #b3b3b3;
      box-shadow: rgb(0 0 0 / 19%) 0px 10px 20px, rgb(0 0 0 / 23%) 0px 6px 6px;
  }
  .btn-notification{
    background-color: transparent !important;
    padding: 3px !important;
    color: #e5e5e5;
    border: 0;
    box-shadow: none;
  }
  .btn-notification:hover,
  .btn-notification:focus,
  .btn-notification[aria-expanded="true"]{
    color: #e5e5e5;
    box-shadow: none;
  }
  #dropdown-notification{
    width: 300px !important;
  }
  #dropdown-notification li > a, #dropdown-notification li > span {
    line-height: 18px !important;
  }

  .badge-notificacion::after{
    content: '';
    background-color: #28a745;
    width: 10px;
    height: 10px;
    float: right;
    padding: 1px !important;
    border-radius: 50%;
  }
  #content-notification li {
    min-height: inherit;
  }

  #content-notification::-webkit-scrollbar-track
  {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
  }

  #content-notification::-webkit-scrollbar
  {
    width: 6px;background-color: #F5F5F5;
  }

  #content-notification::-webkit-scrollbar-thumb
  {
    background-color: #b2b6b7;
  }

    #profile-card{
        max-width: 300px;
        margin: 0 auto;
        margin-bottom: 15px;
        max-height: 390px;
        height: 390px;
    cursor: pointer;
    }
    #profile-card .card-image {
        height: 150px;filter: blur(3px);
    }
    #profile-card .card-image > img{
        height: 150px;
        filter: blur(3px);
        height: 150px;
        background-size: cover;
        box-shadow: 0 4px 9px rgb(0 0 0 / 8%);
        object-position: center;
        object-fit: cover;
    }
    #profile-card .card-profile-image {
        width: 70px;
        max-height: 70px;
        position: absolute;
        top: 104px;
        z-index: 1;
        cursor: pointer;
    }

  .box-primary {
        border-top: 3px solid #000000;
        border-radius: .25rem;
        padding-top: 10px;
        word-wrap: normal;
        /*max-width: 280px;*/
        max-width: 330px;
        margin: 0 auto;
    }
    
    .profile-user-img {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        padding: 3px;
        border: 3px solid #d2d6de;
        border-radius: 50%;
        display: block;
    }
    
    .list-group-item span{
        font-size: 0.9rem;
    }
    
    .sesion-biografia ul,
    .sesion-biografia ul > li{
        padding-left: revert;list-style-type: initial;
    }
    
    .sesion-biografia h1, 
    .sesion-biografia h2,
    .sesion-biografia h3,
    .sesion-biografia h4,
    .sesion-biografia h5,
    .sesion-biografia h6 {
        font-size: revert;margin: revert;font-weight: revert;
    }
    
    .sesion-biografia table {
        border-collapse: revert;border-spacing: 0;
    }
    
    .sesion-biografia table,
    .sesion-biografia th,
    .sesion-biografia td {
        border: 1px solid;
    }
    
    .sesion-biografia caption {
        color: #575756;text-align: revert;caption-side: inherit;
    }
    
    .card-header{
    background-color: #000000;
    color: #FFF;
    text-align: center;
    }
    
    .card .card-content p {
        margin: revert;
    }
    
    .list-group{
        margin-bottom: 0;
    }
    
    .list-group-item+.list-group-item {
        border-top-width: 0;
    }
    
    .icono-enlace{
        display: flex; align-items: center;
    }
    
    .icono-enlace > img{
        width: 25px; margin-right: 7px;
    }
  /* Fin TK001Avisos-20220622 */

  .espacio-icono{
        font-size: 2.2em; margin-right: 10px;
    }

/*Fin estilos notificaciones*/

/*Inicio estilos noticias*/
  .mensaje_noticias{
    color:#000000;font-weight: 500;
  }
  .mensaje_noticias2{
    color:#000000;font-weight: 500;
  }

  .card-coment {
    height: 200px !important;
    width: 415px !important;
  }
  .card .fecha-publicacion {
    margin-bottom: 5% !important;
    font-size: 15px;
    color:#000000;
    font-weight: 600;
  }
  .card .card-title {
        color:#0a2d46;
        font-weight: 800;
        font-size: 21px;
        margin-top: 8px;
    }
  .card .card-cargo {
      color:#0a2d46;
      font-weight: 600;
      font-size: 12px;
      line-height: 1.2;
  }

  .card-contact {
    color:#0a2d46;
    font-weight: 600;
    font-size: 17px;
}

  .card-cargo-content {
    margin-top: -15px !important;
  }

  .card .descripcion {
        color:#000000;font-weight: 400;
    }

  .card .card-action .link_noticias{
    color:#29abe2 !important;font-weight:700 !important;
  }

  .titulo-publicacion {
        color: #000000;margin-bottom: 5%;font-weight:700;
    }

  .contenido-publicacion p {
        font-size: 1.25em;font-weight: 400;color:#000000;
    }

/*Fin estilos noticias*/

/*Inicio estilos webinar*/
  .my-containerwebinar {
    margin: 0 auto;width: 100%;
  }

  .webinar {
    background: #29abe2;
    border: 0;
    color: #fff;
    text-transform: uppercase;
    padding: 6px 16px;
    font-weight:700;
    text-align: center;
    margin-left: 10px;
    margin-bottom: 9px;
    width: 50%;
  }

  .titulo_webinar{
    font-weight:700;color:#000000;margin-left: 6px;
  }

  .my-container-web {
    margin: 0 auto;width: 90%;
  }

  .azul {
    background-color: #29abe2 !important;
  }

  .seleccion {
        background-color: transparent;
        width: 100%;
        padding: 5px;
        border: none;
        border-radius: 2px;
        height: 3rem;
        border-bottom: 1px solid #9e9e9e;
    }

  .dataTables_wrapper{
    width:100% !important;
  }
  .dataTables_wrapper .dataTables_paginate {
    padding-top: 1.25em
  }
  
  .dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-block;
  }

  table.dataTable.no-footer {
    border-bottom: 1px solid #ddd !important; 
  }
     
  table.dataTable thead th, table.dataTable thead td {
    padding: 10px 18px;border-bottom: 1px solid #ddd !important;
  }

  [type=search] {
    outline-offset: 0;
    -webkit-appearance: auto;
  }
/*Fin estilos webinar*/

/*Inicio estilos cursos en mallas*/
  .title_section {
    color: #29abe2;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 400;
  }

  .subtitulo-seccion {
    font-weight: 700;
    font-size: 22px;
    color: #000000;
    padding: 11px 40px 11px 20px;
    white-space: nowrap;
  }
/*Fin estilos cursos en mallas*/

/*Inicio estilos evades*/
  #texto-title-encuesta {
    font-size: 1.9em;
    color: #e07710;
    font-weight: 500;
    padding-bottom: 0.9em;
  }
  #texto-desc-encuesta {
    font-size: 1.3em;color: #29abe2;
  }
/*Fin estilos evades*/
/*Inicio estilos saberes*/
  .name_promalla {
    position: absolute;
    top: 115%;
    left: 50%;
    transform: translate(-55%, -50%);
    color:#000000;
    font-weight:700;
    font-size: 17px;
    line-height: 1.1em;
  }

/*Fin estilos saberes*/
/*Inicio estilos cursos libres*/
  .item-libre .image {
    max-width: 150px;margin: 0 auto;margin-bottom: 15px;
  }

  .subtitulo-libre {
    font-size: 30px;font-weight:700;
  }

  .item-libre .nombre {
    text-align: center;color: #29abe2;
  }

  .subtitulo-libre.cursos {
    margin-top: 50px;
    border-top: 1px solid #bbb;
    padding-top: 30px;
    color: #29abe2;
    margin-bottom: 40px;
  }

  .curso-libre .card-image {
    margin: 0 auto;padding: 15px;
  }

  .curso-libre .card-image img {
    width: 100%;max-width: max-content;margin: 0 auto;
  }

  .curso-libre .card-title {
    font-size: 17px;
    overflow: hidden;
    font-weight: 800;
    color: #29abe2 !important;
  }

  .curso-libre .descripcion {
    text-transform: lowercase;
  }

  .curso-libre .card {
    width: 100%;
    max-width: 270px;
    height: 338px;
    margin: 0 auto;
    margin-bottom: 30px;
  }
/*Fin estilos cursos libres*/

/*Inicio estilo slider*/
  .carousel .carousel-item img{
    width: 100%;
    background-size: cover;
    background-position: center;
  }
  .carousel-indicators li{
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 12px;
    height: 10px;
    margin-right: 0px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #fff;
    background-clip: padding-box;
    border-top: 0px solid transparent;
    border-bottom: 0px solid transparent;
    opacity: .5;
    transition: opacity .6s ease;
    border-radius: 100px;
  }
/*Fin estilo slider*/

/*Inicio estilo tablas*/
  .table-title th {
    text-align: center;
    background-color: #0C2249;
    color: #fff;
    font-size: 1.5em;
    font-weight:600;
    padding: 0.2rem;
   /* border-start-end-radius: 15px;
        border-start-start-radius: 15px;*/
         border-top-left-radius: 15px;
         border-top-right-radius: 15px;
  }

  .table-title-3 th {
    text-align: center;
    background-color: #D63C3C;
    color: #fff;
    font-size: 1.5em;
    font-weight:600;
    padding: 0.2rem;
   /* border-start-end-radius: 15px;
        border-start-start-radius: 15px;*/
         border-top-left-radius: 15px;
         border-top-right-radius: 15px;
  }

  

  table .table-title2 th {
    text-align: center;
    background-color: #dfe0e2;
    color: #000000;
    font-size: 18px;
    text-align:center; 
    font-weight:700;
  }
  
  .table-title3 th {
    text-align: center;
    background-color: #0C2249;
    color: #fff;
    font-size: 1.5em;
    font-weight:600;
    padding: 0.2rem;
    /*border-start-end-radius: 15px;
    border-start-start-radius: 15px;*/
     border-top-left-radius: 15px;
        border-top-right-radius: 15px;
  }
     

  table tbody td, table thead th {
        text-align: center;
    }
  .pagination li a {
    color: #000000;
    display: inline-block;
    font-size: 1.2rem;
    padding: 0 10px;
    line-height: 30px;
  }
  .pagination li.active {
    background-color: #0C2249;
    border-radius: 8px;
        width: 35px;
        text-align: center !important;
  }
  .pagination li.active > a{
    color: #FFFF;
  }

  .list1 {
    justify-content: center;
  }
/*Fin estilo tablas*/

/*Inicio estilo Foros*/
  .body-foro {
    background-repeat: repeat-x;font-family: Rubik;color: #000000 !important;
  }
  .breadcrumb-foro{
    background: #6100d1 !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
    padding: .9rem;
    list-style: none;
    margin: 0;
    width: 1241px;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;

  }
  .breadcrumb-foro li a{
    color : #fff !important;
  }
  .breadcrumb-foro .divider {
    padding: 0 5px;color: #fff;
  }

  .li-a-foro{
    font-size: 17px;color: #000000!important;
  }
  .td-tiempo-foro{
    font-size:12px;color:#000000;vertical-align: middle;font-weight: 700;
  }

  .td-foros{
    font-size:15px;
  }

  .link-foros{
    color: #000000!important;font-weight: 700;
  }

  .dropdown-toggle-foros {
    background-color: #fff !important;border: 1px solid #000000 !important;color: #000000 !important;
  } 
  .tabla-foro{
    font-size: 17px;color: #000000;
  }

  .text-foro{
    font-size: 14px;color: #000000!important;font-weight: 700;
  }

  .nombreusu-foro{
    font-size:12px;float:right;position: relative;top:14px;font-weight: 700;
  }

  .text2-foro{
    font-size: 15px;color: #000000!important;
  }

  .eliminar-foro{
    font-weight: bold;color:#ff0000;font-size: 14px;
  }
  .linkviewtip{
    font-size: 15px;
  }

  .drop-foro{
    border: 1px solid #d9d9d9;font-size: 12px; width: 100%;
  }

  .div-wsy-foro{
    font-size:15px; font-weight: 400; background: #ededed;padding:5px; width: 100%;
  }

    /*este estilo tambien se usa en el administrador*/
  .btn-success-foro {
    color: #fff !important;border-color: #29abe2 !important;background: #29abe2 !important;
  }

  .navbar-inner{
    background: #29abe2 !important;box-shadow: 0 2px 5px rgba(0, 0, 0, .3);padding: .9rem;
  }

  .well-foro {
    background-color: #fff !important;box-shadow: 0 2px 5px rgba(0, 0, 0, .3);font-weight: 700;
  } 

  .cat {
    font-weight: 700;font-size: 11px;color: #000000!important;
  }

/*Fin estilo Foros*/

/* Inicio Details*/
details {
  padding: 0 1rem;
  border-radius: 6px;
  box-shadow: rgb(0 0 0 / 15%) 0px 15px 25px, rgb(0 0 0 / 5%) 0px 5px 10px;
}

details summary {
  padding: 1rem 2em 1rem 0;
  display: block;
  cursor: pointer;
  transition: margin 150ms ease-out;
}

details[open] summary .icon {
  transform: rotate(90deg);
  transition-duration: 1s;
}

details[open] summary{
  margin-bottom: 10px;
}

details summary .icon {
  transition-duration: 1s;
}
/* Fin Details*/

/* Inicio Saberes */
/*Inicio preoload */
#sesion-saberes .sesion-preload{
  position:absolute;
  display: none;
  top: 15%;
  left: 301px;
  width: 90%;
  height: 80%;
  text-align: center;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: 25px;
  font-family: Ubuntu, sans-serif;
  
}
#sesion-saberes .preloader {
  margin: auto;
  width: 100px;
  height: 100px;
  border: 10px solid #eee;
  border-top: 10px solid #666;
  border-radius: 50%;
  animation-name: girar;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes girar {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/*Fin preoload */

#sesion-saberes .mostrar-menu{
  display: none;        
}

#sesion-saberes .accordion > .demo-icon,
#sesion-saberes .calificaciones > .demo-icon {
  font-family: "iconos-sistel" !important;
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: .2em;
  color: #2ebfff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#sesion-saberes .principal{
  display: grid;
  grid-template-columns: 300px auto;
}

/* Estilos del espacio del menú */
#sesion-saberes .zone_1
{
  background: #f1f4f7;
  height: 80vh;
  width: 299px;
  overflow-y: auto;        
  border-right:1.6px solid #4f5372;
}

/* Estilos del espacio donde se muestra el contenido */
#sesion-saberes .zone_2
{
  background: #ffff;
  max-height: 80vh;
  padding: 2%;
  transition: all 5s;
}

#sesion-saberes button:focus {
  background-color: #000000;
  color:#f1f4f7;
}

#sesion-saberes .contenedor_ppal {
  box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.09);
  width: 100%;
  padding: 15px;
  overflow: auto;
  max-height: 74vh       
}

/* Estilos del Scroll solo funcioa en Chrome */
#sesion-saberes .contenedor_ppal::-webkit-scrollbar-track,
#sesion-saberes .zone_1::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 10px;
  background-color: #ffffff;
}

#sesion-saberes .contenedor_ppal::-webkit-scrollbar,
#sesion-saberes .zone_1::-webkit-scrollbar
{
  width: 6px;
  background-color: #dae0df;
}

#sesion-saberes .contenedor_ppal::-webkit-scrollbar-thumb,
#sesion-saberes .zone_1::-webkit-scrollbar-thumb
{
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #b2b6b7;
}
/* FinEstilos del Scroll */

/* Escrol Firefox */
@-moz-document url-prefix() {
#sesion-saberes .contenedor_ppal, .zone_1
  {
    scrollbar-color: #b2b6b7 #ffffff;
    scrollbar-width: thin;
  }
}

#sesion-saberes .contenedor_ppal>* {
  max-width: 100%;
  max-height: 100%;
  border: 0;
  margin-left: auto;
  margin-right: auto;
}

#sesion-saberes .contenedor_ppal audio,
#sesion-saberes .contenedor_ppal video,
#sesion-saberes .contenedor_ppal img,
#sesion-saberes .contenedor_ppal iframe {
  width: 90%;
}

#sesion-saberes .contenedor_ppal img {
  object-fit: cover;
}

#sesion-saberes audio:hover,
#sesion-saberes audio:focus,
#sesion-saberes audio:active,
#sesion-saberes video:hover,
#sesion-saberes video:focus,
#sesion-saberes video:active img:hover,
#sesion-saberes img:focus,
#sesion-saberes img:active iframe:hover,
#sesion-saberes iframe:focus,
#sesion-saberes iframe:active {
  -webkit-box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.4);
  box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.4);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
}

/* Acordion */
#sesion-saberes .accordion, .calificaciones {
  display: flex;
  align-items: center;
  background-color: #ffff;
  color: #000000;
  cursor: pointer;
  padding: 12px 2px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 16px;
  font-family: Rubik, sans-serif;
  transition: 0.4s;
  border-bottom : 0px  transparent;
  border-left: 0px  transparent;
  font-weight: 500;
}

#sesion-saberes .icono {
  -webkit-transition: -webkit-transform .65s ease;
  transition: transform .65s ease;
  font-size: 12px;
  margin-left: 5px;
  margin-right: 5px;
}

#sesion-saberes .zone_1 > .active .icono {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  color:#ffffff;
}

#sesion-saberes .zone_1 > .active, 
#sesion-saberes .accordion:hover {        
  background-color: #000000;       
  color: #ffffff !important;
}

#sesion-saberes .panel {
  display: none;
  background-color: white;
  overflow: hidden;
}

#sesion-saberes .panel .acordion-flujo 
{      
  padding: 10px 0 6px 35px;
  font-size: 15px;
  background-color: #ebeef1;
  color: black;
}

#sesion-saberes .panel .acordion-flujo:hover
{      
  color: #ffff;
  background-color: #29abe2;
}

#sesion-saberes .panel > .acordion-flujo.active
{
  background-color: #29abe2 !important;
}

#sesion-saberes .archivo_flujo > .accordion {
  padding: 7px 0 9px 70px;
  font-size: 14px;
  background-color: #ffff;
  color: black;
}

#sesion-saberes .archivo_flujo > .accordion:hover {
  background-color: #C2C1C2;
  color: #403f3f !important;
}

/* TK001 .active-document */
#sesion-saberes .archivo_flujo > .accordion:focus,
#sesion-saberes .archivo_flujo > .active-document {
  border-left: 4px solid #C2C1C2;
  /*color: #88b41f;*/
  color: #403f3f !important;
  font-weight: 700;
}

#sesion-saberes .contenedor_arc > .nivel_dos{
  font-size: 14px;
  padding-left: 35px;
  background-color: #ebeef1;
}

#sesion-saberes .contenedor_arc > .nivel_dos:hover{
  background-color: #29abe2 ;
}

/* TK001 .active-document */
#sesion-saberes .contenedor_arc > .nivel_dos:active,
#sesion-saberes .contenedor_arc > .nivel_dos:focus,
#sesion-saberes .contenedor_arc > .active-document
{
   /* border-left:4px solid #29abe2 ;*/
  color: #fff;
  background-color: #29abe2 ;
  font-weight: 700;
}

#sesion-saberes .zone_1 .flecha{
  float: left;
}

#sesion-saberes .icono_carpeta
{
  font-size: 24px;
  margin-left: 4px;
  margin-right: 10px;
  color: #000000;
}

#sesion-saberes .active .icono_carpeta
{
  color: #ffff;
}

#sesion-saberes .titulo
{
  width: 100%;
}

#sesion-saberes .retroceso{  
  text-align: left;
  padding: 14px 0px;
  background-color: #ffff;
}

#sesion-saberes .retroceso a{
  display: flex;
  align-items: center;
  color:#000000;
  font-family: Rubik, sans-serif;
  font-size: 16px;
  font-weight: 500;
}

#sesion-saberes .retroceso a i{   
  color: #000000;
  margin-left: 15px;
  margin-right: 15px;
  -webkit-transform: rotate(-20deg);
  padding: 1px; 
  background: #fff;
  border-radius: 15px;
  font-size: 20px;
}

#sesion-saberes .download_img > a > i
{
  font-size: 20px;
  color: #ffff;
  display: inline-block;
}

#sesion-saberes .mensaje_error
{
  background-color: #ecebeb;
  /*height: 50vh;*/
  height: auto;
  margin: 20px 70px;
  padding: 40px 20px;
  border: 0px;
  border-radius: 10px;
}

#sesion-saberes .mensaje
{
  font-size: 20px;
}

#sesion-saberes .nota_pregunta
{
  position: absolute;
  padding: 8px 0;
  bottom: 0;
  width: 90%;
}

#sesion-saberes .acordion-contenido > i :hover{
  color:red;
}

#sesion-saberes .orange.lighten-3 {
  background-color: #ffcc80 !important;
}

#sesion-saberes .timer {
  position: fixed;
  z-index: 2;
  width: auto;
  font-weight: 700;
  right: 1px;
  top: 140px;
  color: #000;
  display: table;
}

#sesion-saberes .timer > div{
  vertical-align: middle;
    display: table-cell;
}

/* TK001 Media Querys */
@media only screen and (max-width: 820px) {
  /* inicio boton menu */
  #sesion-saberes .mostrar-menu{
    display: block;
    position: fixed;
    right: 3px;
    background: #000000;
    border: 0;
    border-radius: 50%;
    padding: 8px 10px;
    color: #FFFF;
    box-shadow: rgb(0 0 0 / 25%) 0px 14px 28px, rgb(0 0 0 / 22%) 0px 10px 10px;
  }
  #sesion-saberes .mostrar-menu:hover,
  #sesion-saberes .mostrar-menu:focus,
  #sesion-saberes .mostrar-menu:active{
    background: #8b8b8b;
  }
  #sesion-saberes .mostrar-menu > i{
    font-size: 1.5em;
    color: #ffffff;
  }
  /* Fin boton menu */
  #sesion-saberes .principal {
    display: grid;
    grid-template-columns: 100%;
  }
  #sesion-saberes .zone_1 {
    position: absolute;
    height: 100%;
    left: -300px !important;
    z-index: 40;
    transition-duration: 1s;
    height: 80vh;
  }
  #sesion-saberes .zone_2{
    /*position: absolute;*/
  }
  #sesion-saberes .zone_active{
    position: absolute;
    left:0 !important;
    transition-duration: 1s;
    z-index: 40;
    /*height: calc(100% - 302px);*/
    height: 80vh;
  }
  #sesion-saberes .mensaje_error{
    margin: 0;
    overflow: auto;
  }
  #sesion-saberes .contenedor_notas {
    padding: 0 !important;
    overflow: auto;
  }
  #sesion-saberes .contenedor_ppal iframe {
    width: 100%;
  }
}

/* Fin saberes */

.custom-file-uploader {
  position: relative;
}
.custom-file-uploader input[type='file'] {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: default;
}

/*Estrella*/
.clasificacion
{
  display: inline-flex !important;
}
.clasificacion input[type="radio"] {
  display: none !important;
}

.clasificacion label {
  color     : grey !important;
  content   : none !important;
  padding   : 0 !important;
  border    : 0 solid transparent !important;
  color     : rgba(0,0,0,0.09) !important;
  position  : none !important;
}

.clasificacion label:before {
  color     : grey !important;
  content   : none !important;
  padding   : 0 !important;
  border    : 0 solid transparent !important;
  color     : #fff !important;
  position  : none  !important;
}
.clasificacion label:after {
  color     : grey !important;
  content   : none !important;
  padding   : 0 !important;
  border    : 0 solid transparent !important;
  color     : #fff !important;
  position  : none  !important;
  font-size : 16px !important;
  background : transparent !important;
}

.clasificacion {
  direction: rtl !important;
  unicode-bidi: bidi-override !important;
}

.clasificacion label:hover,
.clasificacion label:hover ~ .clasificacion label {
  color: orange !important;
  content: none !important;
}

.clasificacion > input[type="radio"]:checked ~ label {
  color: orange !important;
  content: none !important;
}
/* Fin Estrellas*/

.custom-control-input:disabled ~ .custom-control-label {
  cursor: not-allowed;
}

.custom-control .custom-control-input.is-valid:disabled:checked~.custom-control-label{
  color: #fff;
  font-weight: 500;
  background-color: rgb(28 129 6 / 50%) !important;
  border-color: rgb(28 129 6 / 50%)!important;
}
.custom-control .custom-control-input.is-valid:disabled:checked~.custom-control-label::before {
  background-color: rgb(28 129 6 / 50%) !important;
  border-color: rgb(28 129 6 / 50%)!important;
  
}

.custom-control .custom-control-input.is-invalid:disabled:checked~.custom-control-label{
  color: #fff;
  font-weight: 500;
  background-color: rgb(153 8 8 / 50%)!important;
  border-color: rgb(153 8 8 / 50%)!important;
}
.custom-control .custom-control-input.is-invalid:disabled:checked~.custom-control-label::before {
  background-color: rgb(153 8 8 / 50%)!important;
  border-color: rgb(153 8 8 / 50%)!important;
}
.custom-control-label::after,
.custom-control-label::before {
    top: 0.2rem;
    /*left: -1.5rem;*/
    left: -1.5rem;
}
.custom-control-input:checked~.custom-control-label {
  color: #fff;
    border: 1px solid #b3b3b3;
    background-color: #b3b3b3;
    border-radius: 5px;
    padding: 3px;
}

/*Inicio Estilos reporte de jefes*/
.shadow-card {
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.25)!important;
  border: 1px solid rgba(0,0,0,.125);
  height: 128px;
  width: 442px;
  background-color: #e5e5e5;
  /* margin-left: 46px; */
}

.font_card {
  font-weight: 600;
}

.color-link-seguimiento{
    font-weight: 700;
    color:#29abe2;
}
.btn-ver-2{
    color:#e5e5e5;
    font-weight: 400;
    font-size: 14px;
}
.card-stats-compare{
  line-height: 14px;
  font-weight: 400;
  font-size: 0.9em;
}

.card-sesion-seguimiento{
  margin: 0;
  align-items: center;
}
.card-sesion-seguimiento .card-text{
  text-align: center;
  width: 55%;
}
.card-sesion-seguimiento .card-image{
  width: 35%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cin, .colaborador, .sede, .completado, .link , .curso, .calificacion, .regional, .cargo , .completado{
  text-align: center;
  padding: 10px 23px;
  color: #979797;
  font-size: 1em;
  font-weight: 400;
}


.progress-seguimiento {
    display: -ms-flexbox;
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #EAEAEA;
    border-radius: 1rem;
    cursor: pointer;
}

.titulo-detalle-seguimiento {
  text-align: center!important;
  background-color: #0C2249!important;
  color: #fff!important;
  font-size: 1.2em!important;
  font-weight: 700 !important;
  padding: 0.2rem!important;
}

.text-detail {
    color: #29abe2;
    font-size: 0.9em;
    font-weight: 600;
}


.subtitle-seguimiento-detalle{
  font-size: 0.8rem;
  color: #9e9e9e;
  font-weight: 600;
}

.tooltip-inner{
    background-color:#e07710 !important;
  min-height: 30px;
}
.bs-tooltip-right .arrow::before,
.bs-tooltip-aut[x-placement^="right"] .arrow::before
{
    border-right-color:#e07710 !important;
}
/*Fin Estilos reporte de jefes*/

.card-header-qr{
    background-color: transparent;
    text-align: center;
}
.certificado_titulo_qr {
    border-bottom: 5px solid #116949;
    border-top: 5px solid #116949;
    width: 50%;
    margin: auto;
}

.card-header-qr{text-align: center;}
.qr{text-align: center;}
.body-qr{text-align: center;}
.certificado_contenido_qr{text-align: center;}

.card-color{
    background-color: #D63C3C;
}

.img-card-t{
    width: 119px;
    height: 100px;
    /*margin-left: 78px;*/
}

.text-card-cursos{
    color: #ffffff;
    text-align: -webkit-center;
    font-weight: 500;
    font-size: 1.3em;
}
.a-card-cursos{
    background-color: #e9ecf2;
    color: #6100d1;
    padding-left: 5px;
    padding-right: 5px;
}


/*estilos del slider 3d mjp*/

.for_slick_slider{
    display: flex;
}

.for_slick_slider .items{
    width: 350px;
    height: 250px;
    margin: 50px;
    position: relative;
}


.for_slick_slider .items .overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 350px;
    height: 250px;
    background: rgba(0, 0, 0, 0.64);
}

/*para que se vea opacas las imagenes de los lados*/
.for_slick_slider .slick-center .overlay{
    opacity: 0;

}

.for_slick_slider .items img{
    width: 400px;
    height: 250px;
    /*transition: all linear .4s;*/

}

/*esta parte es para que el del centro se vuelva grande*/
.for_slick_slider .slick-center img{
    transform: scale(1.2);

}

/*fin del slider 3d mjp*/

.input-radius{
    border-radius: 13px;
    border-color: #adbcd9;
}

.color-fondo{
    background-color: #ffffff;
}

.texto-bienv-home{
    /*font-weight: 700;font-size: 1em;*/
    color:#0a2d46 ;
    font-weight: 500;
}

.color5{
    color:#252538;
}

.color_fuente_m{
    color: #6100d1;
    font-weight: 900;
    font-size: 2rem;
}

.btn-tamano{
    border-radius: 16px;
    width: 110px;
}

.color6{
   color: #6100d1; 
}

.font-w-700{
   font-weight: 700; 
}

.texto-logros{
    background-color: #FFFFFF;
    border-radius: 12px;
}

.bck-color1{
    background-color: #ffffff;
}

.color-text-card{
    color: #e9ecf2;
}

.cab-card{
    background-color: #0C2249;
    border-start-start-radius: 14px;
    border-start-end-radius: 14px;
    color: #e9ecf2;
    text-align: -webkit-center;
    font-weight: 900;
    font-size: 23px;
}

.cab-card-text{
    margin-top: 16px;
}

.tr{
    border: #dfe0e2 1px solid;
}

.a-menu-despegable{
    font-weight: 600 !important;
    color: #000000 !important;
}

.a-menu-despegable:hover{
    background-color:#D63C3C !important;
    color:#ffffff !important; 
}

/*inicio estilo calendario de eventos*/
.btn-cerrar-modal, .btn-cerrar-modal:hover{
    background-color: #0C2249;
    color: #fff; 
    font-weight: 500;
    text-transform: none;
    border-radius: 16px;
  }
  
  .calendario-contenido{
      background-color: #e9ecf2;
  }

  
  .btn-agregar-calendario, .btn-agregar-calendario:hover{
    background-color: #2ebfff;
    color: #fff; 
    font-weight: 500;
    text-transform: none;
    border-radius: 16px;
  }
  
  .calendario-contenido{
    background-color: #fff;
  }
  
  .link_calendario, .link_calendario:hover{
    color: #2ebfff;
  }
  
/*fin estilo calendario de eventos*/

/*para iconos svg del menu principal*/
    .menu-desktop img {
      min-width: 45px;
      max-width: 45px;
    }


  @media (max-width: 486px) {
  .perfil {
    font-weight: 300;
    font-size: 0.6em;
  }

  .agregar-link{
    width:70%
  }
  
  
}

/* Estilos nuevos */
.button-menu-act{
  color: #e5e5e5;
  min-width: 112px !important;
  margin-left: 15px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
  align-items: center;
  text-align: center;
}

.img-hamburguesa{
  display: inline-block;
  margin-left: 15px;
  color: #e5e5e5;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
  align-items: center;
}

.button-menu-act:hover, .img-hamburguesa:hover{
  box-sizing: border-box;
  background-color: #D63C3C;
  color:#f5f5f5;
  border-radius: 10px;
  box-sizing: border-box !important;
  display: flex;
  align-items: center;
}



.contenido-slide-modulo {
  background: white;
  width: 250px;
  height: 250px;
  border-radius: 20px;
  margin: 0 auto;
  /*-webkit-box-shadow: 4px 20px 22px 2px rgba(0, 0, 0, 0.22);*/
  /*-moz-box-shadow: 4px 20px 22px 2px rgba(0, 0, 0, 0.22);*/
  box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap:5;
}

.contenido-slide-modulo:hover{
  border: 2px solid #0384ce;
  cursor: pointer;
}

.texto-carpeta-curso{
  color:#797a7d !important;
  font-weight:bold;
}

.btn-atras{
    width: 32px;
    height: 32px;
    background-color: #D63C3C;
    box-sizing: border-box;
    color:#ffffff;
    font-weight: normal;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 5px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 2px;
}

.btn-ir-a{
  width: 32px;
  height: 32px;
  background-color: #D63C3C;
  box-sizing: border-box;
  color:#ffffff;
  font-weight: 100;
  padding-left: 11px;
  padding-right: 11px;
  padding-top: 5px;
  border-radius: 100px;
  display: inline-block;
  margin-bottom: 2px;
  margin-right: 10px;
}

.btn-ir-a-link{
  width: 80px;
  height: 34px;
  background-color: #D63C3C;
  box-sizing: border-box;
  color:#ffffff;
  font-weight: 400;
  padding-left: 11px;
  padding-right: 11px;
  padding-top: 5px;
  border-radius: 100px;
  display: inline-block;
  margin-bottom: 2px;
  margin-right: 10px;
  font-size: 16px;
}

.img-fluid_curso{
  width: 50px;
  height: 50px;
  border-radius: 100px !important;
  object-fit:contain ;
}

/* .contenedor-curso{
  max-height: 170px;
  min-width: 400px;
  max-width: 400px;
  color: #000000;
  box-sizing: border-box;
  background-color: #e8edef;
  padding-bottom:10px ;
}
 */
/* @media only screen and (min-width: 1201px) {
  .contenedor-curso{
    margin-left: 60px;
  }
  
}

.contenedor-curso a{
  color: #000000;
} */

.card-hover:hover {
  transform: scale(1.03);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border: solid 1px #D63C3C;
  /* box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); */
}

@keyframes zumbido {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(5px) rotate(2deg);
  }
  50% {
    transform: translateX(-5px) rotate(-2deg);
  }
  75% {
    transform: translateX(5px) rotate(2deg);
  }
  100% {
    transform: translateX(0);
  }
}

.contenedor-curso:hover {
  animation: zumbido 0.5s ease;
}

.zumbable:hover{
  animation: zumbido 0.5s ease;
}


.fondo_curso {
  background-color: #0C2249;
  border-radius: 15px;
  display: flex;
  justify-content: start;
  align-items: center;
  width: 100%;
  margin: 0 auto;
  margin-top: 5px;
  font-size: 10px ;
}

.data-curso{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.fecha-curso{
  font-size: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
}

.estado-curso{
  border: 1px solid #000000;
  border-radius: 25px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 5px;
  height: 40px;
  width: 110px;
}

.estado-curso p{
  font-size: 14px;
}

.pendiente{
  color: #F96464;
  font-weight:700;
}

.iniciado{
  color: #F9B458;
  font-weight:700;
}

.completado{
  color: #0a2d46;
  font-weight:700;
}

.link-tabla {
  border: 1px solid #D63C3C;
  margin: 9px;
  padding: 9px;
  border-radius: 25px;
  background-color: #D63C3C;
}

.btn-ver_cursos{
  width: 80px;
  height: 30px;
  background:#D63C3C;
  margin:0 auto;
  border-radius:25px;
  color:#ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.btn-search{
  background-color: #D63C3C;
  color: #f5f5f5;
  display: flex;
  justify-content: space-between;
  height: 40px;
}
.btn-search i {
	margin-right: 5px;
	}

.contenedor-splide{
  color:#000000;
  /*width:70%; */
  margin: 0 auto; 
  background:#e8edef; 
  border-radius: 15px; 
  padding:10px
}

@media only screen and (width: 1201px) {
  .contenedor-splide{
    width: 90% !important;
  }
  
}

@media only screen and (width: 1440px) {
  .contenedor-splide{
    width: 90% !important;
  }
  
}

@media only screen and (width: 1366px) {
  .contenedor-splide{
    width: 90% !important;
  }
  
}

/* Overlay menu */
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Color negro semi-transparente */
  display: none;
  z-index: 10;
}
.menu-o {
  position: relative;
  z-index:15; /* Asegura que el menú esté por encima del overlay */
}
.menu-ppal{
  z-index:15; /* Asegura que el menú esté por encima del overlay */
}

.logo{
    height:95.55px;
}
.nom-bienvenida {
    font-weight: 600;
    font-size: 1.2rem;
    color: #0a2d46;
}

.igresar-style,.igresar-style:hover {
    background-color: #ffffff;
    color: #D63C3C;
    margin: auto;
    padding: 5px 15px;
    border-radius: 15px;
}

.fa-size{
    font-size: 0.6rem;
}

.title-progreso{
    font-weight:700;
    color:#000000;
}

.card-home:hover {
    border: 2px solid #D63C3C;
    cursor: pointer;
}

.img_logo_footer {
    max-height: 70px;
}

.title-footer {
    font-weight: 700;
    font-size: 1.3em;
    color: #e8edef;
}
.content-footer {
    font-size: 1.1em;
    color: #e8edef;
}

/*cursos pendientes*/
.titulo_principal{
	background: #0C2249;
	color:#ffffff;
	font-size: 20px;
	border-radius: 10px 10px 0 0 ;
	font-weight: normal;

}

.fc-h-event .fc-event-title-container {
  background-color: #0a2d46;
}

.ancho-home-slider {
  width: 89%;
}

.bpw-floating-button, .bpw-floating-button:hover {
  background-color: #3c3c3c;
  margin-top: 30px !important;
}

.bpw-header-container {
  background: #0a2d46;
  border: none;
  color: #fff;
}