.background {
    background-color: #d09;
}

.hidden {
    display: none !important
}

.welcome-container {
    margin-top: 10px;
    padding: 0 30px
}

.welcome-video {
    border-radius: 10px;
    border: 15px solid #fff
}

#video-bienvenida {
    width: 70%;
}

.margin-auto {
    margin-left: auto;
    margin-right: auto;
}

.welcome-container .card {
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    margin-bottom: 20px
}

.welcome-container .uk-card:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.welcome-container a {
    /* color: #7d7d7d; */
}

.section-name {
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: 10px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
}

.section-description {
    font-size: .9em;
    color: #7d7d7d;
    margin-top: 0
}

.card-link a {
    font-size: .9em
}

.display-b {
    display: block !important;
    visibility: initial !important;
}

.loader {
    background-color: #fff;
    background-image: url(../img/loader.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 80px;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 10;
}

h5 {
    font-weight: bold;
    font-weight: 700;
}


a,
a:hover,
a:active,
a:focus {
    text-decoration: none;
    outline: 0;
}

textarea {
    padding: 5px;
    font-family: sans-serif;
    font-size: .9em;
    box-sizing: border-box;
}

/* span[aria-readonly="true"], */
input[readonly],
select[readonly],
textarea[readonly],
input[disabled],
select[disabled],
textarea[disabled] {
    background-color: #dddee0 !important;
    color: #949292 !important;
    pointer-events: none;
}

.justify-text {
    text-align: justify;
}

.span-button.disabled {
    background-color: #ddd !important;
    color: #949292 !important;
    pointer-events: none;
}

[class*=uk-label] {
    padding: 0 10px;
}

.uk-label-revision {
    background-color: #a2a2a2 !important;
    color: #fff;
}

.uk-label,
.uk-label-pre {
    background-color: #33b1c8;
}

.uk-label-pre {
    color: #fff;
}

.uk-label-close {
    background-color: #c8c8c8;
    color: #6d6d6d;
}

.uk-label-warning {
    background-color: #faa05a;
}

.uk-label-danger {
    background-color: #f0506e;
}

.clear {
    clear: both;
}

.responsable {
    margin-top: 0;
    display: inherit;
    padding: 0 5px;
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 0 0px 10px 10px;
}

.responsable i {
    font-size: 0.8em;
    margin-right: 4px;
}

#topbar img {
    height: 50%;
    margin-left: 10px;
}

#menu_toggle img {
    display: none;
}


#form-documento select[read-only],
#form-documento span[data-select2-id="16"] span {
    pointer-events: none;
    background-color: #dddee0 !important;
    color: #949292 !important;
}

#volsettings {
    width: 103%;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    font-size: 0.7em;
}

.uk-dropdown-nav>li>a {
    color: #7b7a7a;
}

#notifications-topbar .uk-icon{
    position: relative;
    cursor: pointer;
    color: #808080;
}

#notifications-topbar .uk-icon::after {
    content: '';
    background-color: #ececec;
    position: absolute;
    top: -14px;
    left: -10px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    z-index: -1;
    cursor: pointer;
}

.notifications-dropdown {
    border-top: 4px solid #2caec6;
    min-width: 30%;
    /* left: 912.502px; */
    top: 60px !important;
    box-shadow: 0 5px 12px rgba(0,0,0,.3);
}

.notifications-dropdown::after {
    content: '';
    background-color: #fff;
    position: absolute;
    top: -12px;
    right: 14%;
    width: 15px;
    height: 15px;
    border-top: 4px solid #2caec6;
    border-right: 4px solid #2caec6;
    transform: rotate(-45deg);
    display: none;
}

.notifications-container {
    padding-left: 20px;
    max-height: 60vh;
    overflow: auto;
}

.notifications-container h4 {
    text-align: center;
}

.notification {
    position: relative;
    padding: 5px 15px;
    padding-left: 30px;
    border-radius: 0 5px 5px 0;
    border-left: 1px solid #e3e3e3;
}

.notification:hover {
    background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(235, 238, 241, 1));
}

.notifications-dropdown a {
    text-decoration: underline;
}

.notification.success::after,
.notification.danger::after,
.notification.warning::after {
    content: '';
    background-color: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -7px;
    margin-top: auto;
    margin-bottom: auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.notification.success::after {
    border: 3px solid #6dc594;
}

.notification.danger::after {
    border: 3px solid #d46262;
}

.notification.warning::after {
    border: 3px solid #e4945c;
}
.notifications-container .notification:last-child {
    border-bottom: 0;
}

.notification span {
    font-size: .8em;
    color: #868686;
}

.notification p {
    margin-top: 0;
    font-size: .9em
}

#sidebar {
    /* background: linear-gradient(#695143 20%, #291b11); Color en plantilla */
    background-repeat: no-repeat;
    background-position: 50% 80%;
    background-size: 100%;
    padding: 20px;
}

#sidebar::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d4d4d4;
}

#sidebar::-webkit-scrollbar {
    width: 3px;
    height: 3px;
    background-color: #d4d4d4;
}

#sidebar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #a4a5ae;
    /* a8a8a8 */
}

#sidebar::-webkit-scrollbar-thumb:hover {
    background: #b1b1b1;
}

.sidebar-title {
    color: #fff;
    font-weight: bold;
}

.sidebar-photo {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 79%;
    left: 17px;
    right: 0;
    /* margin: auto; */
}

.uk-modal-footer i {
    font-size: 1.3em;
}

#sidebar #close_sidebar {
    right: 15px;
    top: 15px;
    color: #404041;
}

#sidebar #close_sidebar svg {
    width: 25px;
    height: 25px;
}

.help {
    position: absolute;
    right: 15px;
    top: 15px;
}

.help a {
    color: #fff;
}

.logo-container{
    position: relative;
}

.profile-container {
    background-color: #fff;
    margin: 20px 0;
    border-radius: 15px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
    padding: 20px 10px;
}

.profile-container a {
    text-decoration: none;
    font-size: 12px;
    color: #000;
}

.profile-container a i {
    font-size: 10px;
}

.statistics-container {
    display: flex;
    margin-top: 10px;
}

.statistics-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.statistics-item:first-child {
    border-left: 0
}

.statistics-item:last-child .statistic-number {
    color: #f45f7f;
}

.statistics-item p {
    margin: 0;
}

.statistics-item p:first-child {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: bold;
    width: 45px;
    height: 45px;
    background-color: #f2f2f2;
    border: 1px solid #000;
    border-radius: 50%;
    color: #000;
}

.statistics-item p:last-child {
    font-size: 8px;
    color: #000;
    margin-top: 5px;
}

.profile-container img {
    border-radius: 50%
}

.profile-container h2 {
    font-size: 1.1em;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
    margin-top: 10px;
}

.profile-container span {
    font-size: .8em;
    font-family: 'Poppins', sans-serif;
    font-weight: 500
}

/* .logo-container::after {
    content: '';
    position: absolute;
    background-color: #fff;
    top: 0;
    left: -18px;
    width: 170px;
    height: 100%;
    z-index: -1
} */

.uk-breadcrumb {
    margin-bottom: 0;
    font-size: .9em;
}

/* Home */

.welcome-banner {
    position: relative;
    background-image: linear-gradient(to bottom right, rgb(227, 25, 56), rgb(158, 29, 57));
    min-height: 200px;
    padding: 30px;
    color: #fff;
    box-sizing: border-box;
    overflow: hidden;
}

.welcome-banner::after {
    background-image: url(../img/logo_dark.png);
    background-repeat: no-repeat;
    background-position: 0 50px;
    background-size: 150%;
    content:'';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 200px;
    opacity: .2
}

.welcome-banner span {
    font-size: 2em;
    font-weight: bold;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
}

.welcome-banner p {
    position: relative;
    width: 85%;
    z-index: 2
}

.card-link .uk-width-1-6 {
    position: relative;
}

.welcome-icon {
    position: absolute;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto !important;
    /* top: 12px; */
    /* left: 30px; */
    width: 50px;
    height: 50px;
}

.welcome-icon.retos {
    background-image: url(../img/exercises.svg);
}
.welcome-icon.beneficios {
    background-image: url(../img/daily-tasks.svg);
}
.welcome-icon.evolucion {
    background-image: url(../img/increasing.svg);
}
.welcome-icon.testimonios {
    background-image: url(../img/testimonies.svg);
}
.welcome-icon.redconocer {
    background-image: url(../img/redconocer.png);
}

.section-title {
    color: #656b71;
    font-weight: 500;
    text-transform: uppercase;
}

.section-title span {
    font-family: 'Poppins', sans-serif;
    font-weight: 700
}

.pt-0 {
    padding-top: 0 !important
}

.course-header-progress .uk-progress {
    margin-bottom: 10px;
    height: 5px
}

.course-header-progress span {
    text-transform: initial;
    font-size: .5em
}

.course-header-progress .progress {
    height: 10px;
    margin-bottom: 0;
    background-color: #e6e6e6;
    border-radius: 0;
}

.course-header-progress .progress-bar {
    background-color: #8cc63f;
    font-size: 9px;
    line-height: inherit;
    box-shadow: inset 0 1px 0 rgba(0,0,0,.15);
    font-weight: 300;
    color: transparent;
}

.course-header-progress .uk-progress::-webkit-progress-value {
    transition: width .6s ease;
    height: 5px
}

.course-header-progress span:nth-child(2) {
    float: left;
}

.course-header-progress span:last-child {
    float: right;
}

.elements-container {
    padding: 30px
}

.section-title p,
.subtitle-text{
    margin: 0;
}

.section-title p {
}

.normal-text {
    font-weight: 300;
    margin: 0
}

.subtitle-text {
    font-weight: 600;
    font-size: 2em;
    margin-left: 20px;
    color: #bb0031
}

#courses-container {
    transition: all .5s
}

.uk-accordion-title {
    border: 1px solid #757577;
    padding: 10px;
}

.panel-title-identidad .panel-heading{
    background-color: #219688 !important;
}
.panel-title-excelencia .panel-heading {
    background-color: #efb44f !important;
}
.panel-title-actualizacion .panel-heading {
    background-color: #689cee !important;
}

.panel-title-identidad h4 a,
.panel-title-excelencia h4 a,
.panel-title-actualizacion h4 a {
    color: #fff
}

.panel-title-identidad .panel-body  {
    background-color: rgba(33, 150, 136, 0.2);
}
.panel-title-excelencia .panel-body  {
    background-color: rgba(239, 180, 79, 0.2);
}
.panel-title-actualizacion .panel-body {
    background-color: rgba(104, 156, 238, 0.2);
}

.course-card {
    background-color: #fff;
    margin-bottom: 15px;
    cursor: pointer;
    box-shadow: 0 10px 15px rgba(0,0,0,.3);
    cursor: pointer;
}

.course-card-image {
    position: relative;
}

.course-card-image img {
    background-color: #e3e3e3;
    border-radius: 10px 10px 0 0;
    width: 100%
}

.course-card-status {
    position: absolute;
    right: 30px;
    bottom: -33px;
    padding: 38px 0;
    font-weight: 500;
    width: 100px;
    height: 100px;
    color: #fff;
    font-size: 1.2em;
    text-align: center;
    border-radius: 50%;
    box-sizing: border-box;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

.course-card-description {
    padding: 30px;
    border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
}

.course-card-description p:first-child,
.course-card-description p:nth-child(2),
.course-card-description p:last-child,
.course-status-info > div > p,
.course-card-status {
    font-family: 'Work Sans', sans-serif;
}

.course-card-description p:first-child,
.course-card-description p:nth-child(2),
.course-status-info > div > p {
    text-transform: uppercase;
    margin-bottom: 0
}

.course-card-description p:first-child {
    font-weight: 700;
    font-size: 1.1em;
    color: #4f5f74;
    margin-top: 0;
    margin-bottom: 10px;
    letter-spacing: 2px
}

.course-card-description p:nth-child(2) {
    font-weight: 300;
    font-size: 1.2em;
    color: #203d64;
    margin-top: 10px;
    margin-bottom: 10px;
    letter-spacing: 1px
}

.course-card-description p:last-child {
    font-weight: 400;
    color: #536277;
    margin-top: 10px;
    margin-bottom: 0;
}

.course-progress {
    position: relative;
}

.course {
    background-color: #fff;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    border: 1px solid #b3b2b5;
}

.course .panel {
    background-color: transparent;
}

.course .panel-heading {
    padding: 0;
    border: 0;
}

.course .tab-content {
    border-radius: 15px;
}

.achievement-progress,
.progress {
    height: 8px;
    margin-bottom: 0;
    background-color: #d8d8d8;
    border-radius: 5px;
    box-shadow: none;
}

.progress-bar {
    font-size: 11px;
    line-height: inherit;
    box-shadow: none;
    background-color: #5fad44;
}

.achievement-progress {
    position: absolute;
    height: 15px;
    border-radius: 0 0 10px 10px;
    bottom: 0;
    width: 100%;
}

.achievement-progress .progress-bar {
border-radius: 0 0 0 10px;
}

.progress-text {
    color: #fff;
}

.course-card .uk-progress {
    background-color: #e6e6e6;
    margin: 0;
    height: 15px;
    border-radius: 0 !important
}

.uk-progress::-webkit-progress-value {
    background-color: #8cc63f;
    transition: width .6s ease;
    border-radius: 0 !important
}

.course-status-info > div {
}

.course-status-info > div > p {
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
    font-weight: 700;
    color: #203d64;
}

.course-status-info > div:nth-child(2) {
    border-left: 1px solid #e3e3e3
}

.progress-success {
    color: #8cc63f;
}

.progress-danger {
    color: #e52b48;
}

.status-por-cursar .course-card-status {
    background-color: #4f5f74;
}

.status-cursando .course-card-status,
.status-cursando .progress-bar {
    background-color: #fbb03b;
}

.status-cursado .course-card-status,
.status-cursado .progress-bar {
    background-color: #8cc63f;
}

.status-por-cursar .progress-bar {
    color: #9f9f9f;
}

.course-container {
    margin-top: 30px;
    transition: all .5s;
    border: 1px solid #e3e3e3;
    padding-top: 29px;
    padding-right: 30px;
    display: none;
}

#identidad.course-container {
    border-top: 4px solid #219688;
}
#excelencia.course-container {
    border-top: 4px solid #F0B44F;
}
#actualizacion.course-container {
    border-top: 4px solid #689CEE;
}

.course-active {
    position: relative;
    background-color: #eaeaea;
    border-color: #434b54;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.course-active::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: -11px;
    margin-top: auto;
    margin-bottom: auto;
    background-color: #eaeaea;
    width: 20px;
    height: 20px;
    border-top: 1px solid #474f58;
    border-right: 1px solid #474f58;
    transform: rotate(45deg);
}

.course-card:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.course-card p {
    font-weight: bold;
    color: #272c33;
}

.course-image {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 60%;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
}
/* 434b54 */
#curso-identidad .course-image {
    background-image: url(../img/targeting.svg);
}
#curso-excelencia .course-image {
    background-image: url(../img/medal.svg);
}
#curso-actualizacion .course-image {
    background-image: url(../img/teamwork.svg);
}

.uk-tab>.uk-active>a {
    border-color: #434b54;
}

/* 434b54 */
#curso-identidad .course-image {
    background-image: url(../img/targeting.svg);
}
#curso-excelencia .course-image {
    background-image: url(../img/medal.svg);
}
#curso-actualizacion .course-image {
    background-image: url(../img/teamwork.svg);
}

.uk-tab>.uk-active>a {
    border-color: #434b54;
}

/* Memoria del conocimiento */

.memoria-conocimiento-input {
    font-weight: 600;
}

.memory-card {
    background-color: #fff;
    border-radius: 10px;
    margin-top: 30px;
    border: 1px solid #b7b7b7;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.memory-card .uk-card-header {
    position: relative;
    min-width: 40px;
    padding: 20px 40px
}

.memory-image {
    margin-left: auto;
    text-align: center;
    margin-right: 10px;
}

.memory-image img {
    width: 100%;
}

.memory-image span.m-l-3 {
    margin-left: -3px
}

.memory-image span.m-3 {
    margin-left: 3px
}

.btn-memory-more {
    background-color: transparent;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    padding: 0 10px
}

.btn-memory-more span {
    color: #a5a5a5
}

.memory-card .uk-card-body {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 80px;
    box-sizing: content-box;
    padding: 0px 20px 0px 15px;
}

.memory-card .uk-card-footer span {
    font-size: .8em;
    color: #909090;
    text-align: center;
}

.memory-items,
.memory-title {
    /* position: absolute; */
    width: 100%;
}

.memory-items p,
.memory-title p {
    margin: 0
}

.memory-items {
    bottom: 0;
    color: #9ca7b5;
    font-size: .9em;
}

.memory-title {
    font-size: 1.2em;
    line-height: 20px;
    font-weight: 600;
    margin-bottom: 0;
    color: #000;
}

.memory-card:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.memory-card:hover .memory-image {
    color: #474f58;
}

.memory-card:hover .uk-card-header,
.memory-card:hover .uk-card-footer {
    border-color: #3b424a;
}

.memory-card .uk-grid-divider.uk-grid-small>* {
    padding-left: 23px;
}

.memory-card:hover .uk-grid-divider>:not(.uk-first-column)::before {
    border-color: #31373e;
}

.memory-card:hover .uk-card-footer span {
    color: #9ca7b5;
}

.uk-dropdown {
    padding: 15px
}

.uk-dropdown a {
    color: #3b424a;
}

/* Recurso */

.resource {
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    margin-bottom: 20px
}

.resource h3 {
    padding: 10px;
    border-bottom: 1px solid #e3e3e3;
    margin-top: 0;
    margin-bottom: 0;
}

.resource .uk-table {
    margin-top: 0;
    margin-bottom: 0;
}

.resource td img {
    width: 100%
}

.modelo-card {
    border: 1px solid #e3e3e3;
    border-top: 4px solid #505f74;
}

/* Modales */

.welcome-container .card-btn {
    margin-bottom: 0;
    background-color: #fff;
    border-radius: 10px;
}

.modal-content {
    border-radius: 25px;
}

.card-btn {
    margin-bottom: 15px
}

.close-btn {
    background-image: url(../img/close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 25px;
    height: 25px;
}

/* .modal-body img {
    height: 70px;
    margin-top: 10px;
    margin-bottom: 20px;
} */

.modal-body table {
    width: 100%;
}

.modal-body td {
    padding: 0.4375em 0.875em
}

.modal-body-recompensas  {
    max-height: 520px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 20px;
}

.modal-body-recompensas::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d4d4d4;
}

.modal-body-recompensas::-webkit-scrollbar {
    width: 10px;
    height: 5px;
    background-color: #d4d4d4;
}

.modal-body-recompensas::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #a4a5ae;
    /* a8a8a8 */
}

.modal-body-recompensas::-webkit-scrollbar-thumb:hover {
    background: #b1b1b1;
}

.nav-tabs>li>a {
    background-color: #E6E6E6 ;
    color: #000;
    border: 0;
    text-transform: initial;
    font-size: .85em;
    padding: 10px;
    border-radius: 0px !important;
    font-weight: 700;
    border-right: 1px solid #fff;
    text-align: center;
}

.nav-tabs>li.active:first-child a {
    background-color: #636363 !important;
}

.nav-tabs>li.active:nth-child(2) a {
    background-color: #ffac00 !important;
}

.nav-tabs>li.active:last-child a {
    background-color: #3daf2f !important;
}

.nav-tabs>li:last-child>a {
    border-right: 0
}

.tab-content {
    background-color: #fff;
    border: 0;
    margin-bottom: 30px;
    box-shadow: none;
}

.tab-content h4 {
    margin-top: 0;
    padding: 0 20px;
    font-weight: 400;
    font-size: 1.4em;
    margin: 20px 0;
    color: #4e4e4e;
}

.nav-tabs {
    background-color: #fff;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    color: #fff;
    background-color: #383934;
    border: 0;
    border-bottom-color: transparent;
    cursor: default;
    font-weight: 700;
    border-radius: 0
}

.nav-tabs>li.active:first-child {
    border-radius: 5px 0 0 0
}

.nav-tabs>li.active:last-child {
    border-radius: 0 5px 0 0
}

.welcome-statistics .nav-tabs>li {
    width: 31.33%
}

.resource-item {
    background-image: url(../img/list-triangle.svg);
    background-repeat: no-repeat;
    background-position: 20px;
    background-size: 10px;
    padding: 10px 35px !important;
    border-bottom: 1px solid #E7E6E6
}

.course-content .tab-content {
    padding-bottom: 40px
}

.welcome-statistics .panel-default {
    cursor: pointer;
}

#paseo-cursos .panel{
    background: linear-gradient(180deg, #ec7277 0%, #ee8576 100%);
}

#areas-sustantivas .panel {
    background: linear-gradient(180deg, #dd3663 0%, #ff819d 100%);
}

#paseo-mc .panel{
    background: linear-gradient(180deg, #6f66cb 0%, #8c65af 100%);
}

#beneficios .panel{
    background: linear-gradient(180deg, #3d85b5 0%, #6bb2c9 100%);
}

#exito .panel{
    background: linear-gradient(180deg, #5852ee 0%, #8581e5 100%);
}

#microsoft .panel{
    background: linear-gradient(180deg, #00a169 0%, #44bb9c 100%);
}

#retos .panel{
    background: linear-gradient(180deg, #e7308c 0%, #ef68ab 100%);
}

#cursos .panel{
    background: linear-gradient(180deg, #fdb115 0%, #e7b58a 100%);
}

.panel-default>.panel-body {
    color: #000;
    padding: 15px 20px;
}

.welcome-statistics .panel-default>.panel-body .curso-statistics p{
    text-align: center;
}

.welcome-statistics {
    margin-bottom: 20px
}

.welcome-statistics .panel-default>.panel-body {
    min-height: auto;
}

.panel-default>.panel-heading {
    background-color: #fff;
    border-radius: 15px 15px 0 0
}

.mis-cursos-titulo {
    font-weight: bold;
    font-size: 1.6em;
    color: #fff;
    font-weight: 700;
    margin-bottom: 0px;
    margin: 0;
}

.mis-cursos-puntaje {
    text-align: center;
    margin-top: 20px !important;
    margin-left: 0 !important;
}

.welcome-statistics .panel {
    margin-bottom: 0;
    border-bottom: 0;
    border-radius: 10px 10px 0 0
}

.reto-title {
    color: #37363c;
    margin: 0;
    font-weight: 500;
    text-transform: uppercase
}

.bienvenida-card {
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.panel.bienvenida-card:hover {
    background: #fff !important;
}

.bienvenida-card,
.retos-card,
.foro-card {
    border-radius: 15px;
}

.bienvenida-card .panel-body,
.retos-card .panel-body,
.foro-card .panel-body {
    position: relative;
}

.bienvenida-card .panel-body {
    min-height: 230px;
}

/* Media query para pantallas entre 1201px y 1399px */
@media screen and (min-width: 1201px) and (max-width: 1399px) {
    .bienvenida-card .panel-body {
        min-height: 300px;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1260px) {
    .bienvenida-card .panel-body {
        min-height: 325px;
    }
}

.bienvenida-card-titulo,
.retos-card-titulo {
    background-color: #fff;
    display: flex;
    margin-bottom: 15px;
    align-items: center;
    border-radius: 15px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.bienvenida-card p {
    color: #fff;
    font-weight: 500;
}

.bienvenida-card p b {
    color: #fff;
}


.bienvenida-card p span {
    color: #fff;
    font-weight: bold;
}

.bienvenida-card-titulo {
    padding: 0 10px;
    min-height: 65px;
}

.bienvenida-card-titulo .curso-icon {
    width: 70px;
    height: 70px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bienvenida-card-titulo p,
.retos-card-titulo p {
    color: #000;
    font-size: 1em;
    font-weight: 600;
    margin-top: 3px;
    margin-left: 10px;
    margin-bottom: 0;
}

.bienvenida-card a {
    display: block;
    color: #000;
    cursor: pointer;
    text-decoration: underline;
    margin-top: 20px;
    font-size: 14px;
}

.bienvenida-text-hover {
    display: none;
}

.bienvenida-card:hover .bienvenida-card-text {
    display: none;
    opacity: 0;
}

.bienvenida-card:hover .bienvenida-text-hover {
    display: block;
    font-size: 1.2em;
    color: #f87380;
}

.bienvenida-card:hover .bienvenida-text-hover span {
    color: #000;
}

.modal-header .close {
    position: absolute;
    top: 15px;
    right: 15px;
    opacity: 1 !important
}

.modal-header {
    background-color: #fff;
    color: #cc002f;
    padding: 15px 30px;
    border-radius: 25px 25px 0 0;
    padding-top: 30px !important;
}

.modal-flex-content {
    display: flex;
    align-items: center;
}

.modal-header h3 {
    font-weight: 600;
    font-size: 2em;
    margin: 0 0 0 10px;
}

.modal-red-title {
    color: #DD052B;
    font-weight: bold;
}

.modal-dark-title {
    color: #383934;
    font-weight: bold;
    font-size: 1.4em;
}

.modal-p {
    font-weight: 500;
    font-size: .9em;
    margin-bottom: 20px
}

.modal-footer-text-left {
    text-align: left !important;
}

.btn-dark, .btn-red {
    color: #fff !important;
    font-weight: 500;
    padding: 10px 18px;
    border-radius: 10px;
    border: 0;
}

.btn-dark {
    background: linear-gradient(145deg, #271f1f 0%, #4d4d4d 100%);
    background-color: #4b4b50;
}

.btn-dark:hover {
    background: linear-gradient(145deg, #4d4d4d 0%, #271f1f 100%); !important;
    color: #fff !important;
}

.btn-red {
    background: linear-gradient(145deg, #d10039 0%, #f35f7e 100%);
}

.btn-red:hover {
    background: linear-gradient(145deg, #f35f7e 0%, #d10039 100%); !important;
    color: #fff !important;
}

.btn-red.btn-active {
    background: #271f1f;
}

.text-red {
    color: #cf052b;
}

#topbar .btn-dark {
    padding: 6px 12px;
    border-radius: 5px;
}

.modal {
  text-align: center;
  padding: 0!important;
}

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-header,
.modal-body,
.modal-footer {
    padding: 25px 50px;
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.btn-dark:hover {
    color: #fff
}

.curso-tema {
    color: #878787;
    padding: 15px 0;
    border-bottom: 1px solid #e3e3e3
}

.mis-cursos-tab a:last-child .curso-tema {
    border-bottom: 0;
}

.curso-tema p {
    font-weight: bold;
    line-height: 16px;
    color: #383934;
}

.curso-tema .col-md-6 {
    font-weight: bold;
    text-transform: uppercase;
    font-size: .8em;
    font-weight: 500;
}

.curso-tema .col-md-6:first-child {
    border-right: 1px solid #b6b6b6
}

.curso-tema:hover p,
.curso-tema:hover .col-md-6 {
    color: #000
}

.curso-statistics {
    position: relative;
}

.curso-statistics p {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1.5em;
    margin: auto;
    font-weight: 800;
    height: 30px;
    text-align: center;
    color: #383934
}

.dropdown-menu {
    right: 0;
    left: inherit;
    padding: 10px;
    min-width: 250px;
}

.dropdown-menu>li>a {
    padding: 3px 0
}

.dropdown-menu i {
    color: #a9a9a9
}

.retos-card-titulo {
    justify-content: space-between;
    padding: 15px;
    margin-bottom: 0;
}

.course-item:nth-child(1) .retos-card-titulo {
    background: linear-gradient(90deg, rgba(243,95,126,1) 0%, rgba(214,44,90,1) 100%);
}

.course-item:nth-child(2) .retos-card-titulo {
    background: linear-gradient(90deg, #8f65ab 0%, #766ec8 100%);
}

.course-item:nth-child(3) .retos-card-titulo {
    background: linear-gradient(90deg, #77bece 0%, #3d85b5 100%);
}

.course-item .nav-tabs {
    display: flex;
}

.course-item .nav-tabs>li {
    width: 100%;
}

.curso-icon {
    position: relative;
    min-width: 70px;
    height: 70px;
    border-radius: 50%;
}

.curso-icon img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 50px;
}

.retos-card-titulo p {
    color: #fff;
    font-size: 25px;
    font-weight: 300;
}

.retos-card {
    border-radius: 10px;
}

.retos-card label {
    text-transform: uppercase;
    margin: 0;
    font-weight: 900;
    color: #383934;
}

.retos-card .btn {
    margin-top: 15px;
}

.retos-card .panel-body {
}

.mis-puntos-principal {
    background-repeat: no-repeat;
    background-position: 40px;
    background-size: auto;
}

.mis-puntos-principal {
    background: linear-gradient(135deg, #cbe2ee 0%, #ecf5fe 100%) !important;
}

.mis-puntos-principal .panel-body {
    padding: 35px
}

.medalla-oro {
    background-image: url(../img/logros/ui_nivel_oro.svg);
}
.medalla-plata {
    background-image: url(../img/logros/ui_nivel_plata.svg);
}
.medalla-bronce {
    background-image: url(../img/logros/ui_nivel_bronce.svg);
}

.sin-medalla {
    background-image: url(../img/gamificacion/sin-medalla.svg);
}

.evaluacion {
    background-image: url(../img/gamificacion/evaluacion.jpg);
    background-size: 150px;
}

.reto-slider-container div:last-child {
    padding-top: 15px;
}

.ui-counter {
    background-color: #e4e4e4;
    padding: 3px 20px;
    border-radius: 20px;
    font-weight: 600;
}

.position-right {
    position: absolute;
    top: 10px;
    right: 10px;
}

.item .ui-counter {
    display: inline-block;
    margin: 0 0 10px;
}

.entidad-certificacion-table td {
    border: 0 !important;
}

.entidad-certificacion-table td:first-child {
    font-weight: bold
}

/* Retos - Mis Puntos */

.mis-puntos-principal h1,
.mis-puntos-principal h3 {
    margin: 0;
    font-weight: 700;
}

.mis-puntos-principal h3 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 20px;
}

.puntos-btn-container {
    margin-top: 20px;
}

.btn-instrucciones,.btn-puntos {
    margin-top: 0 !important;
    text-align: center;
}

.ui-pd {
    position: absolute;
    font-weight: 500;
    bottom: -25px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #000;
    background-color: #e9ecef;
    border-radius: 10px;
    line-height: 20px;
    border: 1px solid #c1c0c0;
    font-size: .75em;
    text-align: center;
}

.ui-pd::after {
    content: '';
    background-color: #e9ecef;
    position: absolute;
    top: -5px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 10px;
    height: 10px;
    transform: rotate(-45deg);
    border-top: 1px solid #c1c0c0;
    border-right: 1px solid #c1c0c0;
}

.retos-card .btn {
    margin-top: 5px;
    margin-bottom: 15px;
}

.progress-container-retos {
    display: flex;
    align-items: center;
}

.retos-resumen-item .panel-body {
    min-height: 150px;
}

.retos-resumen-item img {
    width: 30px
}

.retos-resumen-item h2 {
    font-weight: 800;
    font-size: 2em;
    margin: 0;
}

.retos-resumen-item p {
    text-transform: uppercase;
    font-weight: 600;
    margin: 0;
    color: #000;
}

.retos-resumen-container {
    text-align: center;
}

.retos-resumen-container .col-xs-6:last-child  h2 {
    color: #f45f7f;
}

.retos-resumen-number {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: bold;
    width: 85px;
    height: 85px;
    background-color: #f2f2f2;
    border: 1px solid #000;
    margin: auto;
    border-radius: 50%;
    box-shadow: inset 0 4px 0 rgba(0,0,0,0.3);
}

.reto-slider-container small {
    font-weight: bold;
}

.reto-slider-container img {
    width: 100px !important;
    margin: auto;
}

.reto-slider-container p {
    text-transform: inherit;
}

.retos-slider .owl-nav {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto !important;
    margin-bottom: auto;
    width: 100%;
    height: 40px;
}

.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-nav.disabled {
    display: none;
}

.user-info h2 {
    font-size: 16px;
}

.user-info h4 {
    font-size: 14px;
}

#insignias-slider.owl-carousel .owl-nav.disabled,
#usuarios-slider.owl-carousel .owl-nav.disabled,
#areas-slider.owl-carousel .owl-nav.disabled,
#delegacion-slider.owl-carousel .owl-nav.disabled {
    display: inherit;
}

.retos-panel-title {
    font-weight: 700;
}

.reto-medal-container {
    padding-left: 10px;
    padding-right: 10px;
}

.reto-medal-container span {
    font-weight: 700
}

.reto-medal-container p {
    text-transform: uppercase;
    font-size: .8em;
    font-weight: bold;
    margin: 0;
    line-height: 12px;
}

#usuarios-slider .reto-medal-container p:last-child {
    font-size: .8em;
    margin: 0;
    color: #f46082;
    text-transform: none;
    font-weight: 600;
}

.reto-medal,
.reto-trofeo {
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    font-size: 2em;
    font-weight: 700;
    width: 120px;
    height: 120px;
    margin-left: auto;
    margin-right: auto;
}

.bronce {
    background-image: url(../img/logros/insignia_bronce.svg);
}
.oro {
    background-image: url(../img/logros/insignia_oro.svg);
}
.plata {
    background-image: url(../img/logros/insignia_plata.svg);
}
.por-obtener {
    background-image: url(../img/logros/insignia_por_obtener.svg);
}

.mes-1 {
    background-image: url(../img/logros/ui_area_mes_1.svg);
}
.mes-2 {
    background-image: url(../img/logros/ui_area_mes_2.svg);
}
.mes-3 {
    background-image: url(../img/logros/ui_area_mes_3.svg);
}
.mes-4 {
    background-image: url(../img/logros/ui_area_mes_4.svg);
}
.mes-5 {
    background-image: url(../img/logros/ui_area_mes_5.svg);
}
.mes-6 {
    background-image: url(../img/logros/ui_area_mes_6.svg);
}
.mes-7 {
    background-image: url(../img/logros/ui_area_mes_7.svg);
}
.mes-8 {
    background-image: url(../img/logros/ui_area_mes_8.svg);
}
.mes-9 {
    background-image: url(../img/logros/ui_area_mes_9.svg);
}
.mes-10 {
    background-image: url(../img/logros/ui_area_mes_10.svg);
}

.usuario-mes-1 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_1.svg);
}
.usuario-mes-2 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_2.svg);
}
.usuario-mes-3 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_3.svg);
}
.usuario-mes-4 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_4.svg);
}
.usuario-mes-5 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_5.svg);
}
.usuario-mes-6 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_6.svg);
}
.usuario-mes-7 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_7.svg);
}
.usuario-mes-8 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_8.svg);
}
.usuario-mes-9 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_9.svg);
}
.usuario-mes-10 {
    background-image: url(../img/logros/ui_usuarios_del_mes_del_10.svg);
}

.reto-medal p {
    position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    font-weight: 700;
    height: 30px;
    line-height: 30px;
    font-size: 28px;
}

.reto-medal.bronce p {
    color: #673a03;
}
.reto-medal.oro p {
    color: #8f7414;
}
.reto-medal.plata p {
    color: #484848;
}
.reto-medal.por-obtener p {
    color: #c9c8c8;
}

.cursos-completados {
    background-image: url(../img/logros/ui_mas_cursos_completados.svg);
}
.retos-completados {
    background-image: url(../img/logros/ui_mas_retos_completados.svg);
}
.insignias-obtenidas {
    background-image: url(../img/retos/usuario_insignias.svg);
}
.puntos-conseguidos {
    background-image: url(../img/logros/ui_mas_puntos_conseguidos.svg);
}
.tiempo-en-plataforma {
    background-image: url(../img/logros/ui_mayor_tiempo_en_plataforma.svg);
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    background: transparent !important;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.owl-carousel .owl-nav button.owl-prev {
    left: -15px;
}

.owl-carousel .owl-nav button.owl-next {
    right: -15px;
}

.owl-theme .owl-nav [class*=owl-] {
    font-size: 70px !important;
    color: #ccc !important;
}

.owl-theme .owl-nav [class*=owl-]:hover,
.owl-theme .owl-nav [class*=owl-]:focus {
    background-color: transparent!important;
    border: 0;
    outline: 0;
}

.owl-theme .owl-dots {
    display: none
}

.bienvenida-carousel .owl-dots {
    display: block;
}

.bienvenida-carousel .owl-nav {
    display: none;
}

.owl-theme .owl-dots .owl-dot span {
    background: #fff !important;
    border: 1px solid #e00026;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #e00026 !important;
}

.recompensa-item {
    position: relative;
    border: 1px solid #8B8B8B ;
    margin-bottom: 30px;
    /* min-height: 174px; */
}

.recompensa-item img {
    margin: auto;
}

.recompensa-info {
    background-color: #383934;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 10px;
    opacity: 0;
    transition: all .5s;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.recompensa-info:hover {
    opacity: 1
}

.recompensa-info h4 {
    color: #fff;
    margin-top: 2px;
    font-weight: 600;
}

.recompensa-info p {
    color: #fff;
}

.table-top-10 th {
    text-align: center;
}

.table-top-10 td:first-child {
    color: red;
    font-weight: bold
}

.resultados-area-encabezado {
    display: flex;
    align-items: center;
    border-right: 1px solid #4e4e4e;
}

.resultado-h1,
.resultado-h2 {
font-weight: 800;
}

.resultado-h1 {
    font-size: 3em;
    margin-right: 15px;
    color: #4e4e4e;
}

.resultado-h2 {
    text-transform: uppercase;
    font-size: .8em
}

.resultado-por-area-item > a {
    background-image: url(../img/red-down-arrow.svg);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 10px;
    padding-left: 15px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.resultado-por-area-item > a.collapsed {
    background-image: url(../img/red-right-arrow.svg);
}

.my-comment-container {
    display: flex;
    align-items: center;
    margin: 15px 0;
}

.their-comment-container {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.my-comment-container textarea, .their-comment-container textarea {
    background-color: #f2f2f2;
    border-radius: 30px;
    padding: 15px;
    margin-left: 20px;
    box-shadow: none;
    border: 0;
    font-weight: 500;
}

.my-comment-container img {
    max-width: 60px;
    border-radius: 50%;
}

.their-comment-container img {
    max-width: 50px;
    border-radius: 50%;
}

.their-comment-container {
    margin-left: 100px;
}

.comment-container {
    padding: 15px;
    border-radius: 10px;
    margin-left: 20px;
    flex-grow: 2;
    word-break: break-word;
}

.comment-container li {
    margin-bottom: 15px;
}

.comment-container {
    background-color: #f2f2f2;
}

.comment-container.green {
    background-color: #dff0d8;
    color: #3c763d !important;
}

.my-comment-container .comment-container.green .author-comment, .my-comment-container .comment-container.green .comment-p, .comment-container.green p {
    color: #3c763d !important;
}

.comment-container.destacado {
    background-color: #fae5ea;
}

.comment-container .author-comment {
    position: relative;
    font-weight: 700;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
}

.comment-container .author-comment span {
    font-weight: normal;
    color: #999;
    font-style: italic;
    margin-left: 10px;
}

/*.verified img:after {
    content: '';
    background-image: url(../img/checkmark.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 3px;
    bottom: 0;
    right: 0;
    width: 12px;
    height: 12px;
}*/

.disclaimer-container {
    background-image: url(../img/rewards.svg);
    background-repeat: no-repeat;
    background-position: 50% 40px;
    background-size: 60px;
    background-color: #fff;
    padding: 100px 50px 50px;
    text-align: center;
    margin: 80px;
}



.btn.btn-primary {
    background-image: linear-gradient(#4e4d4d, #272121);
    background-color: #4b4b50;
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    padding: 10px 30px;
    border-radius: 30px;
    border: 0;
}
.bootbox-body {
    margin: 0 0 0 10px;
}

.alert-danger {
    background-color: #fff5f7;
    border-color: #c0bbbe;
    color: #000;
    font-weight: 600;
    margin-top: 30px;
}

/* Challenges styles */

.ui-challenge-item .panel-heading {
    display: flex;
    align-items: center;
    border-radius: 15px;
    color: #fff;
    padding: 15px 30px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.ui-challenge-item .panel-heading img {
    margin-right: 20px;
}

.ui-challenge-item.panel-default {
    border-radius: 15px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    border: 1px solid #929094;
}

.ui-challenge-item .panel-body {
    border-top: 0 !important;
}

.ui-challenge-item .panel-heading .panel-title {
    font-size: 30px;
    font-weight: 600;
}

.orange-gradient,
.ui-crucigramas .panel-heading {
    background: linear-gradient(135deg, #eddd77 0%, #b99a2f 100%);
}

.ui-juegos .panel-heading {
    background: linear-gradient(135deg, #ed8d77 0%, #ec7277 100%);
}

.purple-gradient,
.ui-memoria .panel-heading {
    background: linear-gradient(135deg, #8e64aa 0%, #6f66cb 100%);
}

.blue-gradient,
.ui-sopa-letras .panel-heading {
    background: linear-gradient(135deg, #73b8c8 0%, #3e86b6 100%);
}

.green-gradient,
.ui-tarjetas .panel-heading {
    background: linear-gradient(135deg, #00c999 0%, #00a068 100%);
}

.red-gradient {
    background: linear-gradient(135deg, #ec7277 0%, #d1003a 100%);
}

.ui-challenge-table td {
    border: 0 !important
}

.ui-challenge-table h2 {
    margin: 0;
    font-weight: 700;
}

.ui-challenge-table p {
    margin: 0;
    font-weight: bold;
    color: #000;
}

.ui-challenge-table span {
    font-weight: 500;
    color: #898989;
}

.success-status {
    font-weight: bold !important;
    color: #49af2f !important;
}



.d-flex {
    display: flex;
}

.h-100 {
    height: 100%;
}
.m-0 {
    margin: 0 !important;
}
.p-0 {
    padding: 0 !important;
}
.achievement-level {

}
.achievement-rest {
    background-color: #fff;
    padding: 10px 20px;
    border-radius: 20px;
}
.achievement-level-container {
    display: flex;
    align-items: center;
    margin-top: 20px;
}
.achievement-medal {
    background-color: #f2f2f2;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 150px;
    height: 150px;
    margin-right: 20px;
}
.achievement-level-container h2 {
    font-weight: 800;
    text-transform: uppercase;
    font-size: 40px
}
.achievement-level-container h4 {
    font-size: 14px;
}
.achievement-points-container {
    display: flex;
    align-items: center;
    border-radius: 15px;
    color: #fff;
    padding: 15px 30px;
}
.achievement-points-container h2,
.achievement-points-container p {
 margin: 0;
 color: #000;
}

.achievement-points-container h2{
    font-size: 40px;
    margin-right: 20px;
    font-weight: 800;
}
.achievement-points-container p {
    text-transform: uppercase;
    font-weight: 700;
}

.achievement-points-container.disponibles {
    background: linear-gradient(135deg, #cbe2ee 0%, #ecf5fe 100%) !important;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.slider-card,
.shadow-card {
    position: relative;
    border: 1px solid #bbbabc;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}

.slider-card {
    margin-top: 40px;
}

.slider-card .panel {
    margin-bottom: 0
}

.slider-card .retos-card {
    padding: 30px 0;
}

.slider-card .retos-panel-title {
    position: absolute;
    display: table;
    top: -40px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
    padding: 8px 20px;
    border-radius: 10px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.purple-text {
    color: #6e66cb !important;
}

.area-card {
    border: 1px solid #ddd;
    border-radius: 15px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
    min-height: 305px;
}

.areas-buttons-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.areas-buttons-container .btn {
    margin: 0 10px 10px 0;
}

.areas-subtitles h3,
.area-card h3 {
    font-weight: 700;
}

.area-card h3 {
margin: 0;
}

.areas-subtitles span {
    color: #d10039;
}

.infonavit-accordion .panel-heading {
    border-radius: 15px;
    color: #000;
    padding: 15px 30px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.infonavit-accordion .panel {
    border: 1px solid #b0afb1;
    border-radius: 15px;
}

.curso-row td {font-size: 11px}

@media (max-width: 1380px) {
    .course-card-status {
        padding: 32px 0;
        width: 90px;
        height: 90px;
        font-size: 1.1em;
    }
    .bienvenida-card-titulo .curso-icon {
        min-width: 50px;
        max-width: 50px;
        height: 50px;
        background-size: cover;
    }
    .curso-icon img {
        width: 35px;
    }
    .curso-icon {
        min-width: 60px;
        height: 60px;
    }
    .bienvenida-card-titulo p,
    .retos-card-titulo p {
        font-size: 1em;
    }
}


@media (max-width: 1280px) {
    /* .panel-default>.panel-heading {
        font-size: 1.8em
    } */
    .nav-tabs>li>a {
        padding: 7px;
        margin: 15px 5px 0;
    }
    .nav-tabs>li:first-of-type {
        margin-left: 10px;
    }
}

@media (max-width: 1200px) {

}

@media (max-width: 1105px) {
    .nav-tabs>li>a {
        padding: 5px;
        margin: 0 3px 0;
    }

    .nav-tabs>li:first-of-type {
        margin-left: 10px;
    }
}

@media (max-width: 1024px) {
    .curso-statistics p {
        font-size: .5em;
    }

    .mis-puntos-principal {
        background-position: 10px;
    }
    .bienvenida-card .panel-body {
        min-height: 285px;
    }
    .mis-puntos-principal {
        background-position: 10px 0;
        background-size: 190px;
    }
}

@media (max-width: 992px) {
}

@media (min-width: 768px) {
}

@media (max-width: 768px) {
    #sidebar {
        border-right: 1px solid #e3e3e3;
        box-shadow: 0 0 30px rgba(0,0,0,.2);
    }
    .stitistics-square td {
        font-size: .7em;
    }
    .elements-container {
        padding: 30px 20px;
    }
    /* .logo-container {
        width: 100%;
    }
    .login-links {
        position: absolute;
        margin-top: 20px;
        margin-left: 20px;
        margin-bottom: 40px
    }*/
    .welcome-banner p {
        width: 100%;
    }
    .curso-statistics p {
        font-size: 1em;
    }
    .welcome-icon {
        width: 35px;
        height: 35px
    }
    .course-card-status {
        padding: 32px 0;
        width: 90px;
        height: 90px;
        font-size: 1.1em;
        bottom: -30px
    }
    .principal-sections {
        display: block !important;
    }
    .modal {
        padding-left: 0 !important
    }
    .bienvenida .panel-default>.panel-body {
        min-height: 250px;
    }
    .bienvenida-card .panel-body {
        min-height: auto;
    }
    .resultados-area-encabezado {
        border-right: 0;
        border-bottom: 1px solid #e3e3e3;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
    .welcome-statistics .nav-tabs>li {
        width: 31.33%;
    }
    .curso-icon {
        min-width: 70px;
        height: 70px;
    }
    .bienvenida-card-titulo p,
    .retos-card-titulo p {
        font-size: 1.5em;
    }
    #video-bienvenida {
        width: 100%;
    }
    .modal-header, .modal-body, .modal-footer {
        padding: 20px 20px;
    }
    .mis-puntos-principal {
        background-position: 11px 0px;
        background-size: 183px;
    }
    .area-card {
        min-height: auto;
    }
}

@media (max-width: 670px) {
    .welcome-container {
        /* margin: 30px 20px !important; */
    }

    [uk-scrollspy] div {
        visibility: initial !important
    }

    #courses-container {
        padding-right: 0 !important
    }

    .course-container {
        padding-right: 0 !important;
        width: 90%;
        margin-left: 30px;
        padding-left: 0
    }

    .course-container .uk-progress  {
        margin-left: 15px;
        margin-right: 15px;
        width: 90%
    }

    .courses-init .course-container {
        margin-left: 0
    }
    .bienvenida .panel-default>.panel-body {
        min-height: 270px;
    }
    .their-comment-container {
        margin-left: 60px;
    }
    .btn-red, .btn-dark {
        display: block;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: 15px;
    }
    .mis-puntos-principal {
        background-position: top center;
        background-size: 180px;
        padding-left: 0;
    }
    .resultado-h1 {
        font-size: 2.3em;
        margin-right: 10px;
    }
    .progress-container-retos .progress {
        margin-right: 15px;
    }
    .modal-header, .modal-body, .modal-footer {
        padding: 10px 15px;
    }
    .puntos-btn-container {
        margin-top: 10px;
        display: flex;
        justify-content: center;
        margin-bottom: 40px;
        align-items: center;
        flex-direction: column;
    }
    .disclaimer-container {
        padding: 100px 50px 50px;
        margin: 30px 15px;
    }
}

@media (max-width: 500px) {
    .help {
        position: initial;
    }
    .d-flex {
        display: block;
    }
}
