@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,700");

      :root {
        --font: Open Sans;
        --alt-font: Open Sans;
        --accent-color: #002a16;
        --secondary-color: #daffbf;
        --link-color: #65ba28;
        --accent-highlight-color: #002a16;
        --accent-highlight-background-color: #c3ffe2;
        --accent-tinted-color-70: #b3bfb9;
        --accent-tinted-color-80: #ccd4d0;
        --accent-tinted-color-90: #e6eae8;
        --accent-contrast-color: #fff;
        --accent-contrast-tinted-background-color: #b3b3b3;
        --accent-hover-color: #005d31;
        --secondary-hover-color: #bdff8c;
        --secondary-contrast-color: #111;
        --link-hover-color: #376616;
      }
      
body { background: url('https://d36ai2hkxl16us.cloudfront.net/thoughtindustries/image/upload/v1/course-uploads/345b19c6-dafa-4c72-9882-03b8d4715bcc/vdsyrvkmh2yq-A4M_BG.png'); background-attachment: fixed; background-size: cover; }
.company__logo {text-indent: 100%;white-space: nowrap;overflow: hidden;background: url('https://media.thoughtindustries.com/thoughtindustries/image/upload/a_exif,c_fit,t_ti_company_logo_hires_v3/v1/course-uploads/345b19c6-dafa-4c72-9882-03b8d4715bcc/fi2zs2vrqgw2-A4Mendorsedlogo_white1.png') no-repeat center left;background-size: contain;} .company__logo span.h4 {visibility: hidden;}
:root {
  --brand-dark: #002a16;   /* header, buttons, carousel cards */
  --text-light: #ffffff;   /* text on dark backgrounds */
  --text-dark:  #000000;   /* text on light backgrounds */
  --surface:    #ffffff;   /* light backgrounds */
  --radius:     10px;
}

/* ---------- Header / navigation ---------- */
.header {
  background: var(--brand-dark);
}

.border-top {
  border-color: transparent;
}

.top-bar {
  background-color: transparent;
  border-color: transparent;
  border-radius: var(--radius) var(--radius) 0 0;
}

.top-bar-section ul li {
  background: var(--surface);
  border-radius: var(--radius) var(--radius) 0 0;
  padding: 3px 3px 0;
  margin: 2px 2px 0;
}

/* ---------- Rounded corners ---------- */
/* NOTE: .ember-view is on almost every element of the site, so this
   rounds (and, below, colors) far more than intended. Consider removing. */
.ember-view {
  border-radius: var(--radius);
}

.tab-title,
.tab-title--free-text {
  border-radius: var(--radius) var(--radius) 0 0;
}

.tabs {
  border-top: 0;
  border-bottom: 0;
}

/* ---------- Course ---------- */
.learner__sidebar-inner-list .syllabus__lesson .syllabus__lesson--title {
  font-weight: 100;
  line-height: 3;
}

/* ---------- Catalog ---------- */
.catalog-grid-item {
  border-radius: var(--radius);
  box-shadow: 0 5px 10px rgb(102, 102, 102);
  border-width: medium;
}

.catalog-aggregation,
.catalog-aggregation--expanded {
  border-radius: 0;
  border-width: thin;
}

.widget__alt-title__container {
  padding-left: 10px;
  padding-top: 10px;
}

.learning-path-detail-milestone-item__title {
  display: none;
}

/* ---------- Discussions ---------- */
.items__list--comments .comment {
  padding: 0;
}

.comment-border,
.badge {
  display: none;
}

.items__list--comments .comment .highlight,
.comment__container {
  background-color: var(--surface);
}

.preview-link {
  color: var(--text-dark);
  font-size: x-large;
}

/* ---------- Brand-colored blocks & buttons ---------- */
.featured-content-multi-carousel-item__body,
.btn,
.btn--primary,
.btn--centered,
.btn--large {
  background-color: var(--brand-dark);
  border-radius: var(--radius);
}

/* ---------- Text colors ----------
   Order matters: the dark-text rule for .ember-view comes first so
   the light-text rules below win on buttons. */
.ember-view,
.new-item__label,
.new-item__description {
  color: var(--text-dark);
}

.course-title,
.featured-content-multi-carousel-item__title,
.btn,
.btn--success-new,
.btn--no-margin,
.btn--small,
.btn--right,
.btn--alt,
.category-link,
.category-link--title,
.icon-navigateright,
.icon-navigateleft {
  color: var(--text-light);
}

.btn--link,
.btn--bare,
.expandable-sidebar__topic-link,
.small-4,
.icon-write,
.icon-trash,
.icon-thumbnails,
.icon-bullets,
.icon-stopwatch {
  color: var(--text-dark);
}

.icon-navigateright,
.icon-navigateleft {
  font-weight: bolder;
}
