#page-course-view-menutopic .course-content-header .hasmenu {
  background-color: #4598aa;
  border-radius: 0 0 0.5rem 0.5rem;
}
#page-course-view-menutopic .course-content-header .hasmenu {
  background-color: #4598aa;
  border-radius: 0 0 0.5rem 0.5rem;
}
#page-course-view-menutopic .course-content-header .hasmenu::before {
  margin-top: -128px;
}
#page-course-view-menutopic.pagelayout-course #page-header::before {
  content: none;
}
#page-course-view-menutopic
  .course-content-header
  .hasmenu
  .format-menutopic-menu-boots {
  padding: 2rem 0 1rem;
}
.format-menutopic-menu-boots .navbar {
  background-color: #d1eff1;
  border-radius: 0.5rem;
}
.format-menutopic-menu-boots .navbar .container-menu {
  padding: 0;
}
.format-menutopic
  .navbar:not(.navbar-dark)
  #navbarmenutopic
  .navbar-nav
  .nav-item.menu-level-0.active {
  border-bottom: none;
}
.format-menutopic-menu-boots
  .navbar
  .container-menu
  .menu-body-content
  .menu-label {
  padding: 0.5rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  border-radius: 7px;
  text-align: center;
  vertical-align: middle;
  user-select: none;
  word-break: break-word;
  max-width: 100%;
  white-space: normal;
  transition:
    color 0.15s ease-in-out,
    background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
  margin: 0.5rem;
  cursor: pointer;
  background-color: #ffffff;
}
.format-menutopic-menu-boots
  .navbar
  .container-menu
  .menu-body-content
  .menu-label.active {
  background-color: #4598aa;
  color: white;
}

#page-course-view-menutopic .course-content .menutopic {
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}

#format_menutopic_menu > .navbar {
  max-height: initial;
}
#format_menutopic_menu .navbar-collapse .navbar-nav {
  align-content: center;
  justify-content: flex-start;
  align-items: center;
  flex-direction: row;
}
#format_menutopic_menu .container-menu .navbar-toggler {
  background-color: #8b034f;
}
#format_menutopic_menu .container-menu .navbar-toggler:hover {
  background-color: #8b034fb5;
}
.navbar-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.course-content .single-section .section-navigation {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}
#page-mod-page-view .activity-header {
  border: 1px solid #e1e0e4;
  border-radius: 0 0 7px 7px;
  padding: 1rem;
  margin-top: -5px !important;
  border-top: 0;
}
#page-mod-page-view .activity-header .rui-activity-wrapper {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  overflow: hidden;
}
#page-mod-page-view .activity-header .sr-only {
  position: relative;
  margin: 0;
  display: inline-block;
  width: 100%;
  height: auto;
}

.rui-course-card {
  transition: all 350ms ease-in-out;
  background-color: #25b3af;
}
.rui-course-card:hover {
  background-color: #1c918e;
}
.rui-course-card:before,
.rui-course-card:hover::before {
  background-image: none;
  background-color: transparent;
  background: none;
}
.rui-course-card:after,
.rui-course-card:hover:after {
  background-image: none;
  background-color: transparent;
  background: none;
}

.courseindex .courseindex-item.courseindex-section-title a,
.courseindex .courseindex-item .courseindex-name,
.courseindex .courseindex-item .courseindex-link {
  color: var(--primary);
}
.drawer-course-index {
  background-color: #d9d9d9;
}
.courseindex .courseindex-item:hover,
.courseindex .courseindex-item:focus {
  background-color: var(--primary);
  color: #fff;
}

#fitem_id_userpicturewarning {
  visibility: hidden;
  position: absolute;
  left: 0;
}
#fitem_id_currentpicture {
  visibility: hidden;
  position: absolute;
}

/* - - - - - - - - - - - - - -
ngs.cursospathtoprecision.com 
- - - - - - - - - - - - - - -*/

:root {
  --primary-clover: #0069a8;
  --white-clover: #fdfeff;
}

#page-wrapper {
  #page {
    @media (max-width: 767.98px) {
      padding-top: 0;
    }
  }
}
.page-mycourses {
  .page-header-content.flex-wrap h1 {
    color: var(--white-clover) !important;
  }
  .nocourses {
    color: #ffffff;
    max-width: 720px;
    background: var(--primary-clover);
    padding: 1rem 1.5rem;
  }
}
.page-mycourses .block-myoverview .rui-course-card-deck {
  display: flex;
  width: 50%;
  @media (max-width: 1079.98px) {
    width: 75%;
  }
  @media (max-width: 499.98px) {
    width: 100%;
  }
  .rui-course-card {
    width: 100%;
  }
}

.rui-course-card {
  background-color: #ddddd8 !important;
  .rui-course-card-wrapper {
    > a.text-decoration-none {
      position: relative;
      z-index: 10;
    }
  }
  .rui-course-card-body {
    z-index: 20;
  }
  .rui-course-card-progress-bar {
      background-color: #9494946b;
      padding: 1rem;
      border-radius: 1rem;
      z-index: 30;
  }
}
.rui-course-card .rui-course-card-wrapper:after {
  background-color: rgb(30 29 66 / 30%);
}
.rui-course-card .rui-course-card-wrapper:before {
    background: rgb(48 162 142 / 0%);
    background-image: linear-gradient(-45deg, rgb(48 162 142 / 35%) 53%, #2e73898a 110%);
}
.rui-course-card .rui-course-card-wrapper:hover:after {
  background-color: rgb(10 80 102 / 46%);
}


body #topBar {
  background-color: transparent;
  border-bottom: none;
  box-shadow: none;
  position: relative;
  border-radius: 0;
  min-height: 84px;
  .rui-navbar-brand {
    /* margin-left: 15px; */
    height: 75px;
  }
  .rui-icon-menu--right {
    position: fixed;
    right: 30px;
    top: 15px;
    background: #2e9d89d1;
    padding: 0.3rem 0.4rem;
    border-radius: 2.5rem;
    backdrop-filter: blur(4px);
  }
  .rui-mobile-nav {
    #logo {
      margin-top: 5px;
    }
    @media (max-width: 1079.98px) {
      justify-content: space-between;
    }
  }
  .rui-logo img {
    height: 100%;
    height: 85px;
    max-height: 85px;
    border-radius: 0;
    @media (max-width: 450px) {
      height: 55px;
      max-height: 55px;
    }
  }
  @media (max-width: 1079.98px) {
    .rui-mobile-nav-btn {
      position: fixed;
      top: 15px;
      right: 15px;
    }
    .rui-icon-menu--right {
      top: 10px;
      right: 65px;
    }
    .rui-mobile-nav-btn-close {
      position: fixed;
      right: 15px;
      top: 15px;
    }
  }
  /* @media (max-width: 450px) {
      &.opened {
        .rui-mobile-nav {
          display: none;
        }
      }
    } */
}
#page-header.page-header-content.flex-wrap {
  background-color: transparent;
  padding: 0;
  .rui-main-content-title--h1s {
    color: var(--white-clover);
    font-size: 2.5rem;
    margin: 0;
  }
}
#s-page-footer {
  /* background: var(--white-clover); */
  background-image: linear-gradient(
    328deg,
    #f6a664 0%,
    #eabe97 33%,
    #dcdcd8 59%,
    #dbdbd700 78%,
    #ddddd800 90%
  );
  border: none;
  margin-bottom: 0;
  border-radius: 0;
  margin-left: -15px;
  margin-right: -15px;
  width: calc(100% + 30px);
  padding-top: 60px;
  padding-bottom: 0;
  @media (max-width: 767.98px) {
    margin-left: -10px;
    margin-right: -10px;
    width: calc(100% + 20px);
  }
  hr {
    display: none;
  }
  .rui-footer-copy {
    padding-block: 2rem;
    margin-inline: -80px;
    @media (max-width: 767.98px) {
      margin-inline: -30px;
    }
    background: #04737a;
    color: var(--white-clover);
    a {
      color: var(--white-clover);
      &:hover {
        text-decoration: underline;
      }
    }
  }
  .card-footer {
    border-radius: 20px;
    border: none;
    position: relative;
    overflow: hidden;
    .recorte {
      position: absolute;
      top: 0;
      left: 0;
      transform: translate(-50%, -50%) rotate(45deg);
      width: 80px;
      height: 80px;
      background-color: var(--white-clover);
    }
    h6 {
      color: var(--primary-clover);
      margin-block: 2rem;
    }
    p {
      font-size: 1rem;
    }
  }
}
.rui-breadcrumbs {
  background-color: transparent;
  padding: 0;
  margin: 16px 0 8px 60px;
  .breadcrumb {
    .breadcrumb-item {
      color: #c4c4c4;
      a {
        color: var(--white-clover);
        &:hover {
          text-decoration: var(--primary-clover);
        }
      }
    }
  }
  .breadcrumb-item:first-child a {
    padding-left: 0;
    &:before {
      content: none;
    }
  }
}
.drawer-left-toggle .btn-drawer {
  top: 90px;
  left: 20px;
}
body.path-course-view:not(#page-course-view-participants) {
  .nav-tabs .nav-link:not(.active) {
    color: var(--white-clover);
    &:hover {
      color: #ff0f00;
    }
  }

  #page-header.page-header-content.flex-wrap h1 {
    color: var(--primary);
    font-size: 3.25rem;
    /* border-left: 2px solid #ff0f00;
    padding-left: 0.7rem;
    border-bottom: 2px solid #ff0f00; */
    @media (max-width: 767.98px) {
      font-size: 2.25rem;
    }
  }
  .single-section .section-navigation {
    display: none !important;
  }
  &.role-student {
    .secondary-navigation {
      display: none !important;
    }
    .wrapper-course {
      padding-top: 0;
    }
  }
}
.page-content-header--img,
.page-content-header--img h4 {
  background-color: white;
  .rui-title-container {
    margin-top: 0px;
  }
}

body#page-login-index {
  .main-content {
    background-color: rgba(245, 169, 107, 0.55);
    padding: 0 2rem;
  }
  .rui-hasinstructions-desc {
    display: none;
  }
  .rui-login-box {
    max-width: 480px;
  }
}

#page-login-signup .rui-login-box {
  background-color: #ffffff8a;
  border-radius: 30px 30px 0 0;
  .checkbox .form-check {
    /* background-color: #fff5f5;
      border-radius: 26px; */
    label {
      color: #000000;
    }
  }
  .form-control-static {
    a {
      color: #2e9d89;
      text-decoration: underline;
      font-size: 0.9rem;
      &:hover {
        text-decoration: none;
      }
    }
  }
  .form-control,
  .custom-select {
    box-shadow: none;
    border-radius: 26px;
  }
  .form-group label {
    color: #2e9d89;
  }
  .rui-login-logo {
    max-width: 350px;
  }
  .custom-control.custom-switch {
    display: flex;
    align-items: flex-start;
  }
  .invalid-feedback {
    color: #000000;
  }
  .form-description,
  .form-control-static {
    color: #000000;
  }
}

#page-login-index,
#page-login-signup,
#page-login-forgot_password {
  height: 100%;
  .rui-icon-menu--right {
    background: transparent !important;
  }
  form {
    a:not(.fheader) {
      color: #2e9d89;
      text-decoration: underline;
      &:hover {
        text-decoration: none;
      }
    }
  }
}

/* CURSO */
/* .wrapper-course {
  border-radius: 40px;
} */
.rui-pluginname {
  display: none;
}
.rui-completion-info,
.rui-contentafterlink,
.rui-activity-dates {
  margin-left: 0 !important;
}
.course-content ul.flexsections li:not(:is(#section-0, #section-6)) {
  .rui-section {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;
    gap: 1rem;
    background: white;
    padding: 1rem;

    @media (max-width: 1226px) {
      grid-template-columns: repeat(3, 1fr);
    }
    @media (max-width: 1024px) {
      grid-template-columns: repeat(2, 1fr);
    }
    @media (max-width: 768px) {
      grid-template-columns: repeat(1, 1fr);
    }
  }
  li.activity {
    border-bottom: none;
    display: flex;
    align-items: flex-end;
  }
}
.section .activity.modtype_label.label {
  grid-column: 1 / -1;
  padding-bottom: 0;
}
body#page-course-view-flexsections {
  [data-flexsections-accordion="1"] .section-collapsemenu.collapsed .expandall {
    display: block;
  }
  .wrapper-course {
    background: none;
  }

  ul.flexsections {
    padding-top: 3rem;
    position: relative;
    /* li.section .course-content-item-content {
      margin-top: 1rem;
    } */
    .btn.btn-icon {
      background-color: white;
      color: var(--primary-clover);
      border-radius: 26px;
      box-shadow: inset 0 0 0px 0px white;
      transition: all 0.3s ease-in-out;
      margin-right: 0.4rem !important;
      &:hover {
        color: var(--primary-clover);
        box-shadow: inset 0 0 0px 20px var(--primary);
      }
    }
  }
  .course-content {
    #collapsesections {
      position: absolute;
      top: -45px;
      right: 0;
    }
    ul.flexsections > li.section {
      background-color: #f9f9fa87;
      border-radius: 35px;
      backdrop-filter: blur(8px);
      > .course-section-header .sectionname {
        font-size: 1.1rem;
        line-height: normal;
        color: var(--primary);
        margin: 0 1rem 0 0;
      }
      li.section {
        background-color: transparent;
        .sectionname {
          font-size: 1rem;
        }
      }
    }
    ul[data-for="course_subsectionlist"] {
      list-style: none;
      margin-left: 0;
      padding-left: 0;
      margin-top: 10px;
    }
  }
}
body.path-user {
  .main-content {
    background: white;
    padding: 1rem 2rem;
    border-radius: 1rem;
  }
}
.activity img.activityicon {
  margin: 0 0px 0 0;
  filter: invert(68%) sepia(50%) saturate(576%) hue-rotate(334deg) brightness(103%) contrast(91%);
  height: 32px;
  width: 40px;
}
.rui-instancename {
  line-height: normal;
  display: inline-block;
  font-size: 0.9rem;
  font-weight: 600;
  background: #fff0e3;
  border-radius: 1rem;
  padding: 0.4rem 1rem;
  &:hover {
    background: #ffdfc4;
    color: #07011b;
    scale: 0.96;
  }
}
.course-content ul.flexsections li.section .content.courseicon {
  align-self: flex-end !important;
}
.rui-completion-info .badge-sm {
  font-size: 0.6rem;
}
.path-grade-report-user .user-grade td.category a.toggle-category,
.grade-report-user .user-grade td.category a.toggle-category {
  display: none;
}

.fixed-cookie {
  position: fixed;
  bottom: -12px;
  right: 5px;
  width: 89px;
  text-align: center;
  background-color: #f0f8ffa8;
  padding: 0.2rem 0.5rem 0.8rem;
  color: #094856;
  border-radius: 1rem 1rem 0 0;
  font-size: 10px;
  line-height: 12px;
  &:hover {
    bottom: -5px;
    background-color: #f0f8ffe0;
    transition: bottom ease-in 0.1s;
    color: #094856 !important;
  }
}

.wrapper-course {
  width: 100%;
  /* background-color: #ffffff9c; */
  border-radius: 30px;
  transition: all 0.2s ease-in-out;
  .page-header-content {
        margin: 0;
  }
  .page-header-image {
    img.icon {
      border-radius: 0;
      filter: invert(68%) sepia(50%) saturate(576%) hue-rotate(334deg) brightness(103%) contrast(91%);
    }
  }
  .secondary-navigation {
        backdrop-filter: none;
  }
}