/*Contains any common function to modify the tables, which can then be imported and applied per sub style.
	eg, for the email table may want to show lines, so can import the below to apply show-lines() just for item-container.email*/
/*tag colours on people page for diff link types.*/
@keyframes loading-spinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*Mixin to make avatar circle, for users, to be added inside a .name-and-avatar-display style*/
.course-list-page {
  display: grid;
  grid-template-columns: minmax(auto, 1fr) 3fr;
  width: 100%;
  column-gap: 40px;
  max-width: 1300px;
  justify-items: flex-start;
}
.course-list-page.display-group {
  grid-template-columns: 3fr;
}
.course-list-page.display-group .item-list.course {
  grid-column: 1 / span 1;
}
.course-list-page .item-list.course {
  display: grid;
  grid-column: 2 / span 1;
}
.course-list-page .item-list.course div.item-container.card {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
}
.course-list-page .item-list.course div.item-container.card .item {
  width: 400px;
  -webkit-border-radius: 54px 54px 54px 54px;
  border-radius: 54px 54px 54px 54px;
  background-clip: padding-box;
}
@media only screen and (max-width: 800px) {
  .course-list-page .item-list.course div.item-container.card .item {
    width: 100%;
  }
}
.course-list-page .item-list.course div.item-container.card .item:hover,
.course-list-page .item-list.course div.item-container.card .item:focus {
  background-color: #eeeeee;
}
.course-list-page .item-list.course div.item-container.card .item .course-container {
  display: grid;
  position: relative;
  border: 3px solid #4D849D;
  background-color: #ffffff;
  -webkit-border-radius: 43px 43px 43px 43px;
  border-radius: 43px 43px 43px 43px;
  background-clip: padding-box;
  margin: 10px;
  overflow: hidden;
  grid-template-rows: auto 30px 180px 40px;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-hero {
  overflow: hidden;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-hero img {
  width: 100%;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .summary-rating {
  display: block;
  padding: 5px 20px;
  transform: scale(0.8);
  text-align: center;
  white-space: nowrap;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .summary-rating .rating {
  display: inline-block;
  height: 20px;
  width: 105px;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-details {
  padding: 0 10px;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-details h2 {
  line-height: 1.2em;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-details .course-title {
  font-size: 20px;
  font-weight: 600;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-details .course-brief {
  overflow: hidden;
  height: 75%;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-details .course-brief p {
  font-size: 16px;
  line-height: 27px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.course-list-page .item-list.course div.item-container.card .item .course-container .course-action {
  padding-left: 20px;
}
.course-list-page .item-list.course div.item-container.card .item .commands {
  display: none;
}
.course-list-page .course-display-groups .course-display-group {
  margin-left: 10px;
  grid-column: 3 / span 1;
  padding: 0 0 30px 0;
  border-bottom: solid 2px #AAA;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group {
    display: block;
    padding-top: 20px;
  }
}
.course-list-page .course-display-groups .course-display-group .course-group-header h3 {
  margin-bottom: 10px;
}
.course-list-page .course-display-groups .course-display-group .course-group-header .group-body p {
  margin-top: 5px;
  margin-bottom: 5px;
}
.course-list-page .course-display-groups .course-display-group .course-group-header .learn-more {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 150px;
}
.course-list-page .course-display-groups .course-display-group .course-group-items {
  position: relative;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-pagination {
  position: absolute;
  top: 50%;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-pagination.forward {
  right: -3%;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-pagination.backward {
  left: -3%;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-pagination i {
  font-size: 50px;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .course-group-items .carousel-pagination {
    display: none;
  }
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-indicator {
  display: block;
  text-align: center;
  margin-bottom: 10px;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-indicator i {
  font-size: 20px;
  padding-right: 10px;
}
.course-list-page .course-display-groups .course-display-group .course-group-items .carousel-indicator i:not(.selected) {
  color: lightgrey;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .course-group-items .carousel-indicator {
    display: none;
  }
}
.course-list-page .course-display-groups .course-display-group .course-group-footer {
  text-align: center;
}
.course-list-page .course-display-groups .course-display-group .course-group-footer a {
  margin-right: 10px;
  vertical-align: top;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .course-group-footer {
    margin-top: 20px;
  }
  .course-list-page .course-display-groups .course-display-group .course-group-footer a {
    margin-top: 10px;
  }
}
.course-list-page .course-display-groups .course-display-group .item-list.course div.item-container.card.carousel {
  flex-wrap: nowrap;
  overflow: hidden;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .item-list.course div.item-container.card.carousel {
    flex-wrap: wrap;
  }
}
.course-list-page .course-display-groups .course-display-group .item-list.course div.item-container.card .item {
  flex: 0 0 28%;
  width: 300px;
  margin-left: 0;
  margin-right: 0;
  transition: display ease-in 1s;
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .item-list.course div.item-container.card .item {
    flex: 1 auto;
    width: 100%;
  }
}
@media only screen and (max-width: 800px) {
  .course-list-page .course-display-groups .course-display-group .item-list.course {
    display: block;
  }
}
.course-list-page .course-dashboard-selector .course-buttons {
  grid-row: 6 / span 1;
  grid-column: 1 / span 2;
  text-align: left;
}
.course-list-page .selected-sponsor {
  display: block;
  margin: 0 auto;
}
.course-list-page .selected-sponsor .sponsor-image {
  display: inline-block;
  padding: 20px;
}
.course-list-page .selected-sponsor .sponsor-image img {
  width: 90%;
  padding: 10px;
  max-width: 400px;
}
.course-list-page .selected-sponsor .mission-statement p {
  padding: 10px 30px;
}
@media only screen and (max-width: 1100px) {
  .course-list-page {
    grid-template-columns: 1fr;
    justify-items: initial;
  }
  .course-list-page .item-list.course {
    grid-column: 1;
  }
}
.title h1 {
  margin-bottom: 5px;
}
.title .title-course-rating {
  display: inline-block;
}
@media only screen and (max-width: 800px) {
  .title .title-course-rating {
    display: block;
    text-align: center;
  }
}
.title .title-course-rating .rating {
  display: inline-block;
  height: 20px;
  width: 105px;
}
.title .display-group-title {
  display: block;
  margin-top: 10px;
}
.title .display-group-title .display-group {
  padding: 5px 15px;
  display: inline-block;
  border: 1px solid #4D849D;
  -webkit-border-radius: 43px;
  border-radius: 43px;
  background-clip: padding-box;
}
.title .display-group-title .display-group h4 {
  font-size: 22px;
}
.title .display-group-title .display-group a {
  border: none;
  text-align: right;
  display: block;
}
.page-container.content-container {
  max-width: 1300px;
}
.outer-container.main > .main-page > .content {
  display: flex;
  justify-content: center;
}
.item-edit.course-details-model {
  width: 100%;
  max-width: 1300px;
}
.item-edit.course-details-model section.course-summary {
  grid-column: 1 / span 2;
  grid-row: 1 / span 1;
  display: grid;
  grid-template-columns: 1fr 0.75fr 1fr 1.85fr;
  padding: 50px 50px;
  border-radius: 43px;
  color: #ffffff;
  background-color: #4D849D;
  margin-bottom: 50px;
}
@media only screen and (max-width: 1100px) {
  .item-edit.course-details-model section.course-summary {
    display: block;
  }
  .item-edit.course-details-model section.course-summary h3 {
    margin: 5px 0;
  }
  .item-edit.course-details-model section.course-summary > * {
    margin-bottom: 20px;
  }
}
.item-edit.course-details-model section.course-summary h3 {
  color: #ffffff;
}
.item-edit.course-details-model section.course-summary .button-holder {
  text-align: center;
}
.item-edit.course-details-model section.course-summary .button-holder .text.purchase-course {
  text-align: center;
}
.item-edit.course-details-model section.course-summary .button-holder a.button {
  background-color: #ffffff;
  color: #4D849D;
}
.item-edit.course-details-model section.course-summary .button-holder a.button.hollow {
  background-color: transparent;
  border-color: #ffffff;
  color: #ffffff;
}
.item-edit.course-details-model section.course-summary .course-summary-instructors span {
  display: block;
}
.item-edit.course-details-model section.course-details-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  column-gap: 100px;
}
@media only screen and (max-width: 1100px) {
  .item-edit.course-details-model section.course-details-section {
    grid-template-columns: auto;
    row-gap: 30px;
  }
}
.item-edit.course-details-model section.course-details-section > div {
  height: fit-content;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info > * {
  margin-bottom: 60px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-instructors .course-instructor-container {
  margin-bottom: 20px;
  border: 2px solid #4D849D;
  border-radius: 43px;
  display: grid;
  grid-template-columns: 1fr 4fr;
  overflow: hidden;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-instructors .course-instructor-container .course-instructor-image img {
  width: 250px;
  height: 250px;
  object-fit: contain;
  vertical-align: bottom;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-instructors .course-instructor-container .course-instructor-info {
  padding: 5px;
}
@media only screen and (max-width: 1100px) {
  .item-edit.course-details-model section.course-details-section .course-details-main-info .course-instructors .course-instructor-container {
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    text-align: center;
  }
}
@media only screen and (max-width: 800px) {
  .item-edit.course-details-model section.course-details-section .course-details-main-info .course-instructors .course-instructor-container {
    display: block;
  }
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media only screen and (max-width: 800px) {
  .item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes {
    grid-template-columns: auto;
  }
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item {
  display: flex;
  align-items: center;
  column-gap: 20px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .icon,
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .image {
  display: inline-block;
  height: 70px;
  width: 70px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .icon img,
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .image img,
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .icon span,
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .image span {
  width: 100%;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details .course-attributes .course-attributes-item .course-attributes-text {
  display: inline-block;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item {
  display: flex;
  align-items: center;
  column-gap: 20px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .icon,
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .image {
  display: inline-block;
  max-width: 70px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .icon img,
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .image img,
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .icon span,
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .image span {
  width: 100%;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes .learner-outcomes-item .learner-outcomes-text {
  display: inline-block;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .course-details h3,
.item-edit.course-details-model section.course-details-section .course-details-main-info .learner-outcomes h3 {
  margin: 30px 0 10px 0;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .what-will-you-learn .chapter {
  margin-bottom: 30px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .what-will-you-learn .chapter h3 {
  margin-bottom: 10px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .what-will-you-learn .chapter .lesson-list {
  margin-top: 10px;
  list-style: none;
  padding: 0;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .what-will-you-learn .chapter .lesson-list li {
  position: relative;
  padding-left: 10px;
}
.item-edit.course-details-model section.course-details-section .course-details-main-info .what-will-you-learn .chapter .lesson-list li::before {
  content: "";
  background-color: #4D849D;
  display: inline-block;
  height: 5px;
  width: 5px;
  border-radius: 50%;
  top: -3px;
  left: -5px;
  position: relative;
}
.item-edit.course-details-model section.course-details-section .course-details-aside > * {
  margin-bottom: 50px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews {
  text-align: center;
  border: 3px solid #4D849D;
  -webkit-border-radius: 43px;
  border-radius: 43px;
  background-clip: padding-box;
  padding: 20px 20px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews .review {
  text-align: left;
  padding: 20px 0;
  border-bottom: 1px solid rgba(112, 112, 112, 0.3);
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews .review:last-of-type {
  border-bottom: none;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews .review .review-rating {
  height: 20px;
  width: 105px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews .review .review-author {
  color: #4D849D;
  font-size: 14px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .course-reviews .review .review-author .author::before {
  content: "\f007";
  font-family: 'Font Awesome 5 Pro';
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  font-weight: 600;
  padding-right: 5px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses h3 {
  text-align: center;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container {
  display: grid;
  position: relative;
  border: 3px solid #4D849D;
  background-color: #ffffff;
  -webkit-border-radius: 43px 43px 43px 43px;
  border-radius: 43px 43px 43px 43px;
  background-clip: padding-box;
  margin: 10px;
  overflow: hidden;
  grid-template-rows: auto 30px 180px 40px;
  /*
                    display: grid;
                    position: relative;
                    border: 3px solid @primaryMainColour;
                    border-radius: 43px;
                    overflow: hidden;
                    grid-template-rows: 250px 30px 150px 50px;

                    .course-hero {
                        img {
                            height: 100%;
                            width: 100%;
                            object-fit: cover;
                            object-position: center;
                        }
                    }

                    .summary-rating {
                        display: inline-block;
                        padding: 0px 35px;

                        .rating {
                            display: inline-block;
                            height: @ReviewStarsHeight;
                            width: @ReviewStarsWidth;
                        }                        
                    }

                    .course-details {
                        padding: 10px 35px;


                        .course-title {
                            font-size: 19px;
                            font-weight: 600;
                        }

                        .course-brief {
                            overflow: hidden;
                            height: 75%;
                        }
                    }

                    .course-action {
                        padding: 10px 35px;

                        a.view-details {
                            font-size: 15px;
                        }
                    }*/
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-hero {
  overflow: hidden;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-hero img {
  width: 100%;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .summary-rating {
  display: block;
  padding: 5px 20px;
  transform: scale(0.8);
  text-align: center;
  white-space: nowrap;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .summary-rating .rating {
  display: inline-block;
  height: 20px;
  width: 105px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-details {
  padding: 0 10px;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-details h2 {
  line-height: 1.2em;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-details .course-title {
  font-size: 20px;
  font-weight: 600;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-details .course-brief {
  overflow: hidden;
  height: 75%;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-details .course-brief p {
  font-size: 16px;
  line-height: 27px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.item-edit.course-details-model section.course-details-section .course-details-aside .related-courses .related-course-container .course-action {
  padding-left: 20px;
}