:root {
        --font: Barlow;
        --alt-font: Barlow;
        --accent-color: #64c8bd;
        --secondary-color: #64c8bd;
        --link-color: #2e79ba;
        --accent-highlight-color: #205a53;
        --accent-highlight-background-color: #e8f7f5;
        --accent-tinted-color-70: #d1efeb;
        --accent-tinted-color-80: #e0f4f2;
        --accent-tinted-color-90: #f0faf8;
        --accent-contrast-color: #111;
        --accent-contrast-tinted-background-color: #fff;
        --accent-hover-color: #41b8ab;
        --secondary-hover-color: #41b8ab;
        --secondary-contrast-color: #111;
        --link-hover-color: #72abdc;
      }
      
body { background: url('https://d36ai2hkxl16us.cloudfront.net/thoughtindustries/image/upload/v1/course-uploads/e4a06f17-60b4-4951-9752-8621fbc9eef8/dl6attlr8xu2-cool-background.png'); background-attachment: fixed; background-size: cover; }
.company__logo {text-indent: 100%;white-space: nowrap;overflow: hidden;background: url('https://d36ai2hkxl16us.cloudfront.net/thoughtindustries/image/upload/a_exif,c_fit,t_ti_company_logo_hires_v3/v1/course-uploads/e4a06f17-60b4-4951-9752-8621fbc9eef8/j1lgmnhra7kj-Sitetracker-EDU-Logo-Approved-2022_rgb-fullcolor.png') no-repeat center left;background-size: contain;} .company__logo span.h4 {visibility: hidden;}
.syllabus__section-title-index { display: none; }
.bordered__header.bordered__header--all {Display: None;}
.article-sidebar__custom-fields { display: none; }
.widget--course-purchase .btn--secondary{display:none;}
.magic-dust {
  list-style: none !important;
  display: inline-flex;
  width: -webkit-fill-available !important;
  border-top: 1px solid #e9e9e9;
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: rgb(233, 233, 233);
}
.has-dropdown:hover .drop-me-down {
  visibility: visible;
}
.drop-me-down {
    visibility: hidden;
    overflow: hidden;
    padding: 0;
    position: absolute!important;
    width: 1px;
    z-index: 99;
    min-width: 160px;
    left: 0;
    right: auto;
    background: transparent;
    top: auto;
}
.drop-me-down li:not(:first-of-type) {
    background: #f6f6f6 !important;
    color: #656565 !important;
    white-space: nowrap;
    width: 100%;
}.btn {
    padding-left: 22px;
    padding-right: 22px;
    padding-top: 9px;
    padding-bottom: 9px;
  font-size: 1rem;
}

.learning-path-timeline-milestone-items .learning-path-timeline-milestone-item__asset {
    width: 50%;
}
}
.medium-4 {
    width: 20%;
}
.featured-content-carousel-item__title {
   font-size: 38px;
}
.featured-content-carousel-item__description {
 font-size: 18px;
}
span.engagement__last-login {
display: none !important;
}
font-family: 'Barlow', sans-serif;
}

/* widget padding varations */
.pad-top-1 {padding-top:2em !important;}
.pad-top-2 {padding-top:5em !important;}
.pad-top-3 {padding-top:10em !important;}
.pad-bottom-1 {padding-bottom:2em !important;}
.pad-bottom-2 {padding-bottom:5em !important;}
.pad-bottom-3 {padding-bottom:10em !important;}
.pad-sides-1 {padding:1em 2em !important;}
.pad-sides-2 {padding:1em 5em !important;}
.pad-sides-3 {padding:1em 10em !important;}
.pad-all-1 {padding:2em !important;}
.pad-all-2 {padding:5em !important;}
.pad-all-3 {padding:10em !important;}
.pad-none {padding:0em !important;}

/* CX Internal Panorama custom 
.stdark .dashboard-access .dashboard-access__header{

   background: #22333B !important;
   color: #ffffff;
   font-family: 'Barlow', sans-serif;
}*/
.bk-color-1 {background: #22333B;}
.stdark .dashboard-access{
  background: #22333B !important;
}
.stbg .dashboard-access-tabs.unlist {
  background: #A6ADB0;
  color: #ffffff;
  font-family: 'Barlow', sans-serif; 
}
.stlabel dashboard-access-tab__label {
color: #ffffff!important;

}
/* Internal Panorama custom code */
/* Scope: only affects the catalog widget with this class */
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 {
  display: grid !important;                          /* take over layout */
  grid-template-columns: repeat(4, minmax(0, 1fr));  /* 4 columns on large */
  gap: 16px;                                         /* card spacing */
  margin-left: 0;                                    /* neutralize list gutter */
}

/* Let grid handle sizing (beat Foundation floats) */
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 > li {
  width: auto !important;
  float: none !important;
  display: block !important;
}

/* Card sizing */
.ti-catalog--tight .catalog-grid-item {
  min-height: 280px;
  max-height: 360px;     /* optional cap */
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Image sizing */
.ti-catalog--tight .catalog-grid-item__asset {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

/* Tighter text; override inline heights from TI with !important */
.ti-catalog--tight .catalog-grid-item__title,
.ti-catalog--tight .catalog-grid-item__description,
.ti-catalog--tight .catalog-grid-item__cta-container {
  height: auto !important;
}

/* --- Responsive tweaks --- */
/* ≤1024px: 3 columns */
@media (max-width: 1024px) {
  .ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ≤768px: 2 columns */
@media (max-width: 768px) {
  .ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ≤480px: 1 column */
@media (max-width: 480px) {
  .ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 {
    grid-template-columns: 1fr;
  }
  .ti-catalog--tight .catalog-grid-item__asset {
    height: 140px;
  }
}
/* Prevent NEW/SALE ribbons from being cut off */
.ti-catalog--tight .catalog-grid-item,
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 > li {
  overflow: visible !important;
}

.ti-catalog--tight .catalog-grid-item__asset-container {
  position: relative;         /* anchor for absolute ribbon */
  overflow: visible !important;
}

/* Make sure the ribbon sits above the image */
.ti-catalog--tight .catalog__ribbon {
  position: absolute;          /* TI usually does this, but force it just in case */
  top: 8px;
  left: 8px;
  z-index: 3;
}

/* Keep the text tidy WITHOUT clipping the ribbon */
.ti-catalog--tight .catalog-grid-item__title,
.ti-catalog--tight .catalog-grid-item__description {
  height: auto !important;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.ti-catalog--tight .catalog-grid-item__title { -webkit-line-clamp: 2; }
.ti-catalog--tight .catalog-grid-item__description { -webkit-line-clamp: 2; }

/* Optional: if the image is too tall after changing overflow */
.ti-catalog--tight .catalog-grid-item__asset {
  height: 150px;
  object-fit: cover;
}
/* Position the NEW ribbon in the top-right corner */
.ti-catalog--tight .catalog__ribbon {
  position: absolute !important;
  top: 1px;
  right: -1px;        /* move to right side */
  left: auto !important;
  z-index: 3;
}

/* Adjust the little corner triangle if used */
.ti-catalog--tight .catalog__ribbon .catalog__ribbon-corner {
  right: 0;
  left: auto;
  transform: rotate(90deg); /* optional: flips corner correctly for right side */
}
/* Scope to your page/widget */
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-left: 0;           /* neutralize Foundation gutter */
  padding-left: 0;          /* ensure no list indent */
  grid-auto-flow: row dense;/* pack items tightly if any gaps occur */
}

/* Kill Foundation's clearfix so it doesn't eat the first grid cell */
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2::before,
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2::after {
  content: none !important;
  display: none !important;
}

/* Ensure only LIs act as grid items; neutralize float widths */
.ti-catalog--tight ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 > li {
  width: auto !important;
  float: none !important;
  display: block !important;
  padding-left: 0 !important; /* removes block-grid left padding */
}