@charset "UTF-8";
.form-switch .form-check-input {
  border-radius: 100px;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.messages {
  position: fixed;
  z-index: 1000;
  bottom: 20px;
  right: 20px;
}
.messages .alert.message {
  animation-name: fade-in;
  animation-duration: 0.3s;
  animation-timing-function: ease-in;
}

.content .image.lightbox {
  cursor: pointer;
}

.lightbox-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
  align-items: center;
  justify-content: center;
}
.lightbox-container.visible {
  display: flex;
}
.lightbox-container .lightbox-image {
  box-shadow: 0 0 50px black;
  max-width: 80vw;
  max-height: 80vh;
  object-fit: contain;
  border: 20px solid white;
}
.lightbox-container .lightbox-description {
  box-shadow: 0 0 50px black;
  background: black;
  color: white;
  padding: 5px 15px;
  border-radius: 15px;
  position: absolute;
  bottom: 50px;
  max-width: 70vw;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.lightbox-container .next,
.lightbox-container .prev {
  display: block;
  width: 50px;
  height: 50px;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  line-height: 50px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  background: black;
  color: white;
  cursor: pointer;
}
.lightbox-container .next {
  right: 50px;
}
.lightbox-container .prev {
  left: 50px;
}

.slider {
  position: relative;
  overflow: hidden;
}
.slider .slider-images {
  transition: transform 400ms ease-in-out;
  transform: translateX(0%);
  white-space: nowrap;
  font-size: 0;
}
.slider .slider-images .slider-image {
  position: relative;
  width: 100%;
  display: inline-block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.slider .slider-images .slider-image .slider-image-caption {
  display: inline-block;
  max-width: 80%;
  background: rgba(0, 0, 0, 0.4);
  color: white;
  border-radius: 15px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: bold;
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: center;
}
.slider.with-bullets {
  padding-bottom: 50px;
}
.slider.with-bullets .slider-images .slider-image .slider-image-caption {
  bottom: 20px;
}
.slider.fading .slider-images {
  transition: none;
  white-space: normal;
  transform: translateX(0) !important;
}
.slider.fading .slider-images .slider-image {
  background-color: transparent;
  transition: opacity 400ms ease-in-out;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.slider.fading .slider-images .slider-image.active {
  opacity: 1;
}
.slider .prev-image-link,
.slider .next-image-link {
  position: absolute;
  display: block;
  text-decoration: none !important;
  line-height: 25px;
  transform: translateY(-50%);
  top: 50%;
  font-weight: bold;
  width: 25px;
  height: 25px;
  background-color: #0dcaf0;
  border-radius: 50%;
  color: white;
  font-weight: bold;
  text-align: center;
  transform: translateY(-50%);
  cursor: pointer;
}
.slider .prev-image-link {
  left: 20px;
  content: "←";
}
.slider .next-image-link {
  right: 20px;
  content: "→";
}
.slider .slider-image-links {
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  white-space: nowrap;
  padding: 6px;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 6px;
  display: flex;
}
.slider .slider-image-links .slider-image-link {
  cursor: pointer;
  border: 1px solid white;
  border-radius: 50%;
  height: 10px;
  width: 10px;
  margin: 3px;
}
.slider .slider-image-links .slider-image-link:hover {
  background-color: rgba(255, 255, 255, 0.5);
}
.slider .slider-image-links .slider-image-link.active {
  background-color: white;
}

.completion-status {
  width: 20px;
  height: 20px;
  display: inline-block;
}
.completion-status img {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
}

.bookmark-button {
  display: inline-block;
}

.grid .grid-item {
  position: relative;
}
.grid .grid-item .grid-thumbnail {
  border-radius: 1rem;
}
.grid .grid-item .item-link {
  display: block;
  text-decoration: none !important;
}
.grid .grid-item .grid-item-icons {
  position: absolute;
  top: 20px;
  right: 80px;
}
.grid .grid-item .grid-item-bookmark {
  position: absolute;
  top: 0px;
  left: 30px;
}
.grid .grid-item .grid-item-actions {
  display: flex;
  align-items: center;
  position: absolute;
  top: 10px;
  right: 25px;
}
.grid .grid-item .grid-item-dropdown {
  border: 3px solid white;
  border-radius: 3px;
}
.grid .grid-item .grid-item-user-count {
  background: white;
  padding: 5px 10px;
  border-radius: 5px;
  position: absolute;
  top: 10px;
  left: 25px;
  font-size: 12px;
}

.page-video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
.page-video-container .page-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 1rem;
}

.training,
.chapter,
.page {
  user-select: none;
}
.training h1,
.training h2,
.training h3,
.training h4,
.training h5,
.training h6,
.chapter h1,
.chapter h2,
.chapter h3,
.chapter h4,
.chapter h5,
.chapter h6,
.page h1,
.page h2,
.page h3,
.page h4,
.page h5,
.page h6 {
  font-size: 1.5rem;
  font-weight: bold;
}
.training .main-content,
.chapter .main-content,
.page .main-content {
  position: relative;
}
.training .content,
.chapter .content,
.page .content {
  user-select: none;
}
.training .content table,
.chapter .content table,
.page .content table {
  width: 100%;
}
.training .content p,
.chapter .content p,
.page .content p {
  margin-bottom: 20px;
}
.training .content .image,
.chapter .content .image,
.page .content .image {
  max-width: 100%;
}
.training .content img,
.chapter .content img,
.page .content img {
  max-width: 100%;
}
.training .content ul,
.training .content ol,
.training .content blockquote,
.training .content table,
.chapter .content ul,
.chapter .content ol,
.chapter .content blockquote,
.chapter .content table,
.page .content ul,
.page .content ol,
.page .content blockquote,
.page .content table {
  margin-bottom: 20px;
}
.training .content ul,
.training .content ol,
.chapter .content ul,
.chapter .content ol,
.page .content ul,
.page .content ol {
  padding-left: 20px;
}
.training .content ul ul,
.training .content ul ol,
.training .content ol ul,
.training .content ol ol,
.chapter .content ul ul,
.chapter .content ul ol,
.chapter .content ol ul,
.chapter .content ol ol,
.page .content ul ul,
.page .content ul ol,
.page .content ol ul,
.page .content ol ol {
  margin-bottom: 0;
}
.training .content blockquote,
.chapter .content blockquote,
.page .content blockquote {
  position: relative;
  font-family: Georgia, "Times New Roman", Times, serif;
  background-color: #f8f8f8;
  color: #666;
  padding: 20px 40px;
  font-size: 1.15rem;
}
.training .content blockquote p,
.chapter .content blockquote p,
.page .content blockquote p {
  margin: 0;
}
.training .content blockquote:before,
.chapter .content blockquote:before,
.page .content blockquote:before {
  left: 20px;
  top: 0px;
  content: "“";
  position: absolute;
  font-size: 2rem;
  color: #ccc;
}
.training .content blockquote:after,
.chapter .content blockquote:after,
.page .content blockquote:after {
  right: 20px;
  bottom: -10px;
  content: "”";
  position: absolute;
  font-size: 2rem;
  color: #ccc;
}
.training .assignments h1,
.training .assignments h2,
.training .assignments h3,
.training .assignments h4,
.training .assignments h5,
.training .assignments h6,
.chapter .assignments h1,
.chapter .assignments h2,
.chapter .assignments h3,
.chapter .assignments h4,
.chapter .assignments h5,
.chapter .assignments h6,
.page .assignments h1,
.page .assignments h2,
.page .assignments h3,
.page .assignments h4,
.page .assignments h5,
.page .assignments h6 {
  font-size: 1.25rem;
}

.sidebar {
  top: 55px;
  position: sticky;
}
.sidebar ul,
.sidebar ol {
  margin-bottom: 0;
}

.grid-item .grid-item-title {
  font-size: 1.1rem;
  font-weight: bold;
}

.assignment-number {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  text-align: center;
  color: white;
  background: gray;
  border-radius: 50%;
  line-height: 1.5rem;
}

.file-list .file-item {
  line-height: 12px;
  font-size: 12px;
  position: relative;
  text-decoration: none;
}
.file-list .file-item .error {
  position: absolute;
  background: #f00;
  color: white;
  font-weight: bold;
  padding: 10px 5px;
}
.file-list .file-item .error:before {
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-top: 20px solid #f00;
}
.file-list .file-item td {
  vertical-align: middle;
  height: 35px;
}
.file-list .file-item .file-item-name-container {
  padding-left: 30px;
  background-image: url("/assets/page-3ea6cf90.svg");
  background-repeat: no-repeat;
  background-size: 20px;
  background-position: 5px center;
}
.file-list .file-item .progress {
  float: right;
  display: block;
  width: 200px;
}

.submission {
  border-bottom: 1px solid #ddd;
  margin-bottom: 1.5rem;
}
.submission:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
}

.content-list .start-page {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ddd;
}
.content-list .pages {
  margin-bottom: 10px;
}
.content-list .content-item {
  position: relative;
}
.content-list .content-link {
  font-size: 14px;
}
.content-list .content-page-link,
.content-list .content-training-link,
.content-list .content-chapter-link {
  position: relative;
  line-height: 14px;
  text-decoration: none;
  display: block;
  padding: 10px 45px;
  min-height: 34px;
  background-repeat: no-repeat;
  background-position: left 15px top 6px, right 15px top 7px;
  background-size: 18px, 20px;
  margin: 0 -15px;
  background-color: #f8f9fa;
}
.content-list .content-page-link:hover,
.content-list .content-training-link:hover,
.content-list .content-chapter-link:hover {
  background-color: #dae0e5;
}
.content-list .content-page-link:hover.current:hover,
.content-list .content-training-link:hover.current:hover,
.content-list .content-chapter-link:hover.current:hover {
  background-color: #f8f9fa;
}
.content-list .content-page-link.odd,
.content-list .content-training-link.odd,
.content-list .content-chapter-link.odd {
  background-color: #eee;
}
.content-list .content-page-link.odd:hover,
.content-list .content-training-link.odd:hover,
.content-list .content-chapter-link.odd:hover {
  background-color: #d5d5d5;
}
.content-list .content-page-link.odd.current:hover,
.content-list .content-training-link.odd.current:hover,
.content-list .content-chapter-link.odd.current:hover {
  background-color: #eee;
}
.content-list .content-page-link.bookmarked::after,
.content-list .content-training-link.bookmarked::after,
.content-list .content-chapter-link.bookmarked::after {
  content: " ";
  display: inline-block;
  width: 9px;
  height: 9px;
  position: absolute;
  left: 17px;
  top: 6px;
  background: url("/assets/bookmark-filled-3b070ac4.svg") no-repeat center;
  background-size: contain;
}
.content-list .content-page-link.current,
.content-list .content-training-link.current,
.content-list .content-chapter-link.current {
  color: black;
}
.content-list .content-page-link,
.content-list .content-training-link {
  background-image: url("/assets/page-black-292b431f.svg");
}
.content-list .content-chapter-link {
  font-weight: bold;
  background-image: url("/assets/chapter-black-c1ecfa2a.svg");
}
.content-list .completion-status {
  position: absolute;
  right: 0px;
  top: 7px;
}

.related-content .related-training-link,
.related-content .related-chapter-link,
.related-content .related-page-link {
  line-height: 30px;
  text-decoration: none;
  display: block;
}
.related-content .lock-icon {
  opacity: 0.3;
}

.bottom-navigation,
.top-navigation {
  position: relative;
}
.bottom-navigation .prev-link,
.bottom-navigation .next-link,
.top-navigation .prev-link,
.top-navigation .next-link {
  height: 100%;
  position: relative;
  display: block;
  text-decoration: none !important;
  cursor: pointer;
  line-height: 25px;
}
.bottom-navigation .prev-link,
.top-navigation .prev-link {
  padding-left: 30px;
}
.bottom-navigation .prev-link::before,
.top-navigation .prev-link::before {
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  background-color: #45186a;
  border-radius: 50%;
  content: "←";
  color: white;
  font-weight: bold;
  text-align: center;
  transform: translateY(-50%);
}
.bottom-navigation .next-link,
.top-navigation .next-link {
  padding-right: 30px;
}
.bottom-navigation .next-link::after,
.top-navigation .next-link::after {
  font-weight: bold;
  position: absolute;
  top: 50%;
  right: 0;
  width: 25px;
  height: 25px;
  background-color: #45186a;
  border-radius: 50%;
  content: "→";
  color: white;
  font-weight: bold;
  text-align: center;
  transform: translateY(-50%);
}

.breadcrumb .breadcrumb-item {
  max-width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.breadcrumb .breadcrumb-item.active {
  max-width: initial;
}

.trainings-index a,
.splash a {
  text-decoration: underline;
}
.trainings-index .site-link,
.splash .site-link {
  text-decoration: none;
}
.trainings-index .page-title,
.splash .page-title {
  display: flex;
  align-items: center;
}
.trainings-index .badge,
.splash .badge {
  background-color: #cd9400;
}
.trainings-index .training-price,
.splash .training-price {
  text-transform: uppercase;
}

.splash {
  min-height: 100vh;
  background-size: cover;
  background-position: center center;
}
.splash .btn.btn-primary {
  color: white;
  border: none;
  font-weight: 300;
  text-transform: uppercase;
  text-decoration: none;
}
.splash .content {
  position: relative;
  margin-top: 80px;
}
.splash .index-link {
  position: absolute;
  top: -40px;
  left: 0px;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  text-transform: uppercase;
  text-decoration: none;
}
.splash .training-introduction,
.splash .training-content {
  margin-bottom: 20px;
}
.splash .icon {
  width: 1rem;
  height: 1rem;
}
.splash .thumbnail {
  border-radius: 1rem;
}
.splash .content .content-chapter-link,
.splash .content .content-page-link {
  background-color: transparent;
}
.splash .content .content-chapter-link:hover,
.splash .content .content-page-link:hover {
  background-color: transparent;
}
.splash .features .icon {
  vertical-align: middle;
  width: 15px;
  height: 15px;
  display: inline-block;
  margin-right: 10px;
}
.splash .sidebar ul {
  margin-bottom: 20px;
  margin-left: 0;
  padding-left: 15px;
}
.splash .sidebar ul.list-unstyled {
  padding-left: 0;
}

.languages {
  position: fixed;
  top: 40px;
  right: 40px;
  z-index: 100;
  top: 4px;
}

.training-link {
  display: block;
}