/*Fondos login / registro*/

.fondo-login {
  background-color: white;
}

.fondo-registro {
  background-color: white;
  background-image: url(../img/fondo-registro.jpg);
  background-size: cover;
  background-position: top center;
}
/*========= General  ============*/

footer {
    margin-top: 0 !important; 
    padding: 0 !important;
    background-color: #154496;

}

/*========= Login  ============*/

.fondo-login>div:first-child { display: none;}
.fondo-login>div:last-child {}
#panel-login .panel-sombra {box-shadow: none !important;}
#panel-login::after { content: "Patrocinado por:"; background-image: url(https://canceryherenciaroffo.igloosuite.com/Content/Clients/canceryherenciaroffo.igloosuite.com/img/logoAz.png); background-position: right; padding-top: 16px; display: block; background-repeat: no-repeat; width: 260px; margin: auto; margin-top: -16px; }
#panel-login .titulo-principal {color: #8A0051 !important;border-bottom: 3px dotted #DC0081;}
#panel-login h3 {text-align: center;font-weight: bold;padding: 10px;font-size: 2rem;}
#panel-login .foot-login {padding-bottom: 15px; border-bottom: 1px solid #CADCDC;}
#panel-login .foot-login div {margin-top: 20px; border-top: 1px solid #CADCDC; padding-top: 15px;}
#panel-login .foot-login div:last-child{margin-top: 0; border-top:0;}
#panel-login .foot-login label {font-weight: normal;}
#panel-login .foot-login label a {font-weight: bold; color: #DC0081;}

#panel-aviso {padding: 0 130px;}
#panel-aviso p {
    font-size: 0.8em;
}

.menu-lateral { background: #3e3e3e !important; }
.menu-lateral>div {padding: 0;}
.menu-lateral a {display: block;}

.nombre-usuario {color: #DC0081; font-weight: bold;padding-top: 0;margin: 0;}
.imagen-usuario {width: 40px;height: 40px;padding-top: 6px;background: #ece9e9; text-align: center; margin: 0;}
.svg-inline--fa {height: auto;}
.svg-inline--fa.fa-w-14 {width: 1.3em;}
#navbarNavDropdown .dropdown-toggle::after {vertical-align: baseline;}

a .navbar, .navbar-brand, header { background: #FFF !important; }

.navbar-default .navbar-nav > li > a {
  color: #fff !important;
}
.nav-pills > li.active > a {
  background-color: #fff !important;
  color: #772250 !important;
}
.btn-secundario,
.btn-terciario {
  background-color: #e6b039 !important;
  color: #772250 !important;
}

.a-lateral-menu-options {color: #fff; background-color: #123C58; border-color: #123C58; margin: 10px;}

.logo-lab {
  background: transparent !important;
}
#btn-login,
#panel-aviso #btn-info,
#panel-login .btn-primario {
  background: #DC0081 !important;
  color: #fff !important;
  border-radius: 0 !important;
  font-size: 1.3rem;
}
#panel-login .titulo-principal,
.foot-login .clr-texto-ppal,
#panel-aviso .clr-texto-ppal {
  color: #7b0060 !important;
}
.fondo-registro .clr-texto-ppal {
  color: #DC0081 !important;
  border: 0;
}
#panel-login.box-form {
  background: #036b9e !important;
}
#btn-registro,
.btn-send-form {
  background: #DC0081 !important;
  color: #fff !important;
  margin-top: 35px !important;
}
#panel-login .enlace-volver {
  color: #fff !important;
}
.nav-stacked > li {
  padding: 10px 0;
  border-bottom: 1px solid #252424;
}

/*Color marca principal*/

.clr-fondo-ppal,
.panel-progreso {
  background: #e9e9e9 !important ;
}

.clr-fondo-secundario {
  background-color: #f0b000;
}

/*=====================*/

/*Color texto principal*/

.clr-texto-ppal {
  color: #772250 !important;
}
.clr-texto-secundario {
  color: #d80002;
}
a.clr-texto-ppal:hover {
  color: #522c6c;
  text-decoration: underline;
}

/*=====================*/

/*Boton primario/Texto boton primario*/

.btn-primario {
  background-color: #dc2d17 !important;
  color: #fff;
}
.btn-primario:hover,
.btn-primario:focus {
  color: #fff;
}

/*VMO*/
.btn-primario.inactive {
  background-color: transparent;
  border: 1px solid #522c6c;
  color: #522c6c;
}
/*=====================*/

/*Boton secundario/Texto boton secundario*/

.btn-secundario {
  background-color: #fff;
  color: #522c6c;
}

.btn-secundario-vmo:hover {
  color: #fff;
}
.btn-secundario:hover,
.btn-secundario:focus {
  color: #036ba9;
}

/*VMO*/
.btn-secundario-vmo {
  background-color: #f93332;
  color: #fff;
}
/*=====================*/

/*Boton terciario/Texto boton terciario*/

.btn-terciario {
  background-color: white;
  color: #522c6c;
}

.btn-terciario:hover,
.btn-terciario:focus {
  color: #522c6c;
}

/*=====================*/

.btn-inactivo {
  background-color: #afaeaf;
  color: #dedede;
  cursor: not-allowed;
}

/*Item contenido visto*/

.contenido-visto {
  background-color: #036ba5;
  color: white;
}

/*=====================*/

/*Item contenido visto*/

.contenido-encurso {
  background-color: #eeeeee;
}

/*=====================*/

/*Item contenido visto*/

.contenido-pendiente {
  background-color: #dbdbdb;
}

/*=====================*/

/*Opciones quiz*/

input.radio-r:checked ~ label {
  background-color: #036ba5;
  color: #fff;
}

/*=====================*/

/*Barra progreso quiz*/

.progress-bar-first {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f9b000+0,bc502c+100 */
  background: #f0b000;
  /* Old browsers */
  background: -moz-linear-gradient(left, #f0b000 0%, #bc502c 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #f0b000 0%, #bc502c 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #f0b000 0%, #bc502c 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f0b000', endColorstr='#bc502c', GradientType=1);
  /* IE6-9 */
}

.progress-bar-two {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bc502c+0,9e2141+100 */
  background: #bc502c;
  /* Old browsers */
  background: -moz-linear-gradient(left, #bc502c 0%, #9e2141 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #bc502c 0%, #9e2141 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #bc502c 0%, #9e2141 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#bc502c', endColorstr='#9e2141', GradientType=1);
  /* IE6-9 */
}

.progress-bar-three {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bc502c+0,9e2141+100 */
  background: #bc502c;
  /* Old browsers */
  background: -moz-linear-gradient(left, #9d2340 0%, #4b0113 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #9d2340 0%, #4b0113 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #9d2340 0%, #4b0113 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9d2340', endColorstr='#4b0113', GradientType=1);
  /* IE6-9 */
}

/*=====================*/

/*Flechas slider*/

.slick-prev:before,
.slick-next:before {
  color: #522c6c;
}

/*=====================*/

/*Barra progreso*/

.progress {
    height: 1.3rem;
    font-weight: bold;
}

.progress-bar {
  background-color: #DC0081;
  color: #FFF;
}

/*=====================*/

/*=====================*/

/*Label */

.label {
  border: 1px solid #522c6c;
  padding: 6px 12px;
  border-radius: 8px;
}

/*=====================*/

/* Simulador */

.clr-prim {
  color: #046aa5 !important;
}

.titulo-prim-simulador,
.titulo-sec-simulador {
  color: #dc2d17 !important;
}

.btn-prim-simulador {
  background-color: #dc2d17 !important;
  color: #fff !important;
}

.btn-sec-simulador {
  background-color: #003c62 !important;
  color: #fff !important;
}

.btn-sec-simulador:hover,
.btn-sec-simulador:focus,
.btn-prim-simulador:hover,
.btn-prim-simulador:focus {
  color: #fff !important;
}

.btn-outline {
  border: 1px solid #ccc !important;
  background: transparent;
  border-radius: 0;
  margin: 4px 0;
}

.btn-dolor {
  border: 0 !important;
  background: #ececec !important;
  pointer-events: none;
}

.btn-bg-simulador {
  font-size: 24px;
}

.simulador-border-right {
  border-right: 1px solid #522c6d !important;
  padding-right: 10px;
}

.main-menu .nombre-usuario {
  color: #DC0081;
}

.main-menu.open {
  background: #FFF !important;
  color: #DC0081;
}

.main-menu.open .dropdown-toggle .nombre-usuario {
  color: #DC0081 !important;
}

.menu-dcha > li a:hover,
.menu-dcha > li a:focus {
  background: #dddee0 !important;
  color: #464242 !important;
}

section#simulador-pregunta > div > div > p:nth-child(4) {
  display: none;
}

.navbar-brand {position: relative; background: #FFF !important; box-shadow: none !important;margin-left: 4rem !important;}
.navbar-brand img {width: 100%;}
.navbar .navbar-collapse {width: 95%; margin: auto;}
.menu-dcha, .main-menu .nombre-usuario {color: #DC0081 ;}

.titulo-principal .clr-texto-ppal {color: #DC0081 !important;font-family: 'Trade Gothic Bold';font-size: 2.5rem;}
.txt-subtitle-bd-class {position: relative;}
.txt-subtitle-bd-class::after {content: '';height: 7px; width: 190px; background: #DC0081; position: absolute;bottom: -17px; left: 0;}
.subtitulo {color: #8A0051 !important;font-size: 1.8rem;}
.lista-cursos .panel {margin: 40px 0 !important;background: #DDDEE9 !important;}
.lista-cursos .panel-body {padding: 0 !important;}
.lista-cursos .panel-progreso {background: #DDDEE9 !important;}
.lista-cursos .icono-progreso {background-color: #DC0081;color: #FFF;border: 2px solid #FFF;}

.lista-cursos .card {margin: 30px 0;}
.lista-cursos .card-title.subtitulo  {border: 0;width: 100%;}
.lista-cursos .img-thumbnail  {padding: 0;}

.txt-title-bd-class, .txt-subtitle-bd-class, .descripcion h2  {color: #DC0081;}
.basic-color-class {color:#00354F;}
a.d-flex-perfil { color: #FFF; background-color: #DC0081; border-radius:0 ; border:0; padding: 5px 30px !important; -webkit-border-radius:0 ; -moz-border-radius:0 ; -ms-border-radius:0 ; -o-border-radius:0 ; }
a.d-flex-perfil p {color: #FFF;}

h3.txt-subtitle-bd-class::before {
  content: ''; 
  background-image: url('https://canceryherenciaroffo.igloosuite.com/Content/Clients/canceryherenciaroffo.igloosuite.com/img/icon_perfil.png');
  height: 50px;
  width: 50px;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  left: -60px;
}
.titulo-principal>h3.txt-subtitle-bd-class::before  {
  content: ''; 
  background-image: url('https://canceryherenciaroffo.igloosuite.com/Content/Clients/canceryherenciaroffo.igloosuite.com/img/icon_book.png');    
  height: 50px;
  width: 50px;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  left: -60px;
}

.clr-texto-ppal {border-bottom: 7px solid; padding-bottom: 10px; display: inline-block; width: 200px;}
.descripcion>h2.subtitulo {width: auto;border: 0;padding: 0;} 

#guardar-editar-perfil, #guardar-editar-perfil:hover  { color: #FFF !important; background-color: #DC0081; border-radius:0 ; border:0; padding: 5px 30px !important; border-radius:0 ; -webkit-border-radius:0 ; -moz-border-radius:0 ; -ms-border-radius:0 ; -o-border-radius:0 ; }
footer .container {margin-left: 15%;}

.foot-login>.clr-texto-ppal {border:0;}
#titulo-div {width: auto;}

.fondo-registro .logo-lab {height: 45px;}
.fondo-registro .enlace-volver {margin: auto;}


main>.row {margin: 0;}
.lista-cursos {padding: 2%;}
.progress-bar-striped {background-image: none;}
.bg-light {background-color: #FFF !important;}
.lista-temas-contenido .svg-inline--fa {color: #DC0081;font-size: 2.4rem;}
#pop-content .modal-lg {max-width: 70%;}
#pop-content #contentContainer .modal-body {padding: 1% 10%;}
.btn-general-custom {background-color: #DC0081; color: #FFF;}
.txt-title-bd-class {margin-top: 50px;}
.txt-subtitle-bd-class {margin-bottom: 50px;}

@media (min-width: 992px) {
  .menu-lateral {
    height: 100vh !important;
  }
}

.container-fluid {
  padding: 0;
  margin: 0;
}

.contProgreso .panel-progreso {
  background: transparent !important;
}

@media (max-width: 760px) {
  .imgCurso {
    display: none;
  }
  .contCurso {
    padding-right: 0px !important;
  }
  .contCursoDos {
    padding-right: 0px !important;
    padding-left: 20px !important;
  }
  .contInfo {
    padding-left: 30px !important;
    padding-bottom: 30px !important;
  }
  .contProgreso {
    padding: 40px 20px 40px 21px !important;
  }
  .contBlanco {
    height: 130px !important;
  }
  header .nav-link {
      display: block; width: 70%; padding: 0;
  }
  .div-lateral-menu-options {
      margin: 0 !important;
  }

  .contenido-interno .panel-contenido-interno .titulo-principal>.clr-texto-ppal {font-size: 2rem; width: auto; text-align: center;}
  .lista-temas-contenido li {font-size: 1.2rem;padding-right: 20%; position: relative;}
  .lista-temas-contenido .float-right {display: flex; position: absolute; top: 50%; right: 0; transform: translate(-50%, -50%);}
  .modal-footer {flex-wrap: nowrap;align-items: center;justify-content:center;}
  .lista-temas-contenido .svg-inline--fa {color: #DC0081;font-size: 2rem;}
  #pop-content .modal-footer .btn-secundario, #pop-content .modal-footer .btn-terciario {font-size: 1rem !important;margin: 3px;padding: 5px 20px;}
  #pop-content .modal-lg {max-width: 100%;}
  .pop-quiz {background: #FFF;}
  .pop-quiz-respuestas {margin-top: 8%;}
  #contentContainer {overflow: auto !important;}
  .custom-terms {width: 85%; margin: auto;}
  .txt-subtitle-bd-class {margin-left: 20%;}

}
@media (min-width: 760px) and (max-width: 815px) {
  .imgCurso {
    display: none;
  }
  .contCurso {
  }
  .contInfo {
    padding-left: 30px !important;
    padding-bottom: 30px !important;
  }
  .contProgreso {
    padding: 40px 20px 35px 22px !important;
  }
  .contBlanco {
    height: 125px !important;
  }
}
@media (min-width: 815px) and (max-width: 1030px) {
  .imgCurso {
    display: none;
  }
  .contCurso {
  }
  .contInfo {
    padding-left: 30px !important;
    padding-bottom: 30px !important;
  }
  .contProgreso {
    padding: 40px 20px 35px 15px !important;
  }
  .contBlanco {
    height: 135px !important;
  }
}
@media (min-width: 1030px) and (max-width: 1290px) {
  .imgCurso {
    display: none;
  }
  .contInfo {
    padding-left: 30px !important;
    padding-bottom: 30px !important;
  }
  .contProgreso {
    padding: 56px 20px 56px 10px !important;
  }
  .contBlanco {
    height: 250px !important;
  }
}
@media (min-width: 1290px) and (max-width: 1450px) {
  .contProgreso {
    padding: 62px 20px 62px 10px !important;
  }
  .icon {
    margin-bottom: 10px;
  }
  .contBlanco {
    height: 250px !important;
  }
}

@media (min-width: 1200px) {
  .contProgreso,
  .contBlanco {
    height: 250px !important;
  }
}

@media (max-width: 767.98px) {
  html {
    background-position: 23%;
  }
}