:root {
        --font: IBM Plex Sans;
        --alt-font: Literata;
        --accent-color: #003da5;
        --secondary-color: #ff6e08;
        --link-color: #003da5;
        --accent-highlight-color: #003da5;
        --accent-highlight-background-color: #d8e6ff;
        --accent-tinted-color-70: #b3c5e4;
        --accent-tinted-color-80: #ccd8ed;
        --accent-tinted-color-90: #e6ecf6;
        --accent-contrast-color: #fff;
        --accent-contrast-tinted-background-color: #b3b3b3;
        --accent-hover-color: #0050d8;
        --secondary-hover-color: #d45800;
        --secondary-contrast-color: #111;
        --link-hover-color: #0c66ff;
      }
      
body { background: url('https://d36ai2hkxl16us.cloudfront.net/thoughtindustries/image/upload/v1/course-uploads/5b54c88d-4639-4346-8837-b36a3d144089/cygr2tt869wk-bg_production.jpg'); 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/5b54c88d-4639-4346-8837-b36a3d144089/ywczbk6ass55-PracticeLHLogo-75px.png') no-repeat center left;background-size: contain;} .company__logo span.h4 {visibility: hidden;}
/*
    DO NOT MODIFY THIS CODE DIRECTLY IN THE THOUGHT INDUSTRIES WEBSITE WITHOUT
    UPDATING THE GIT REPO FIRST.

    Make all changes in the `aledade.thought-industries` repo first, so they
    remain in version control. Once the code has been merged in, you can copy
    and paste it into the website.

    This code is located in the following places
    - Ti URL: https://learninghub.aledade.com/learn/manager/microsite/custom?tab=css
    - Ti Path: Design > Theme > Custom Code > CSS
    - Git: https://gitlab.aledade.com/aledade/aledade.thought-industries/-/blob/trunk/Design/Custom%20Code/css.css
*/


/****************************/
/* Header Navigation Layout */
/****************************/

/* Hides the "Cart" nav link in the top right */

nav.nav.nav--top[role="navigation"] {
    /* Keeps things from squishing if cart is the only link in the nav */
    min-height: 3.125rem; /* 50px */
}

nav.nav.nav--top[role="navigation"] #cart-button {
    display: none;
}

/********************************/
/* Course Detail Sidebar Layout */
/********************************/

/* Second button labeled "Show Purchasing Options or Gift" */
.widget--course-purchase .btn--secondary {
    display: none;
}


/********************/
/* Dashboard Layout */
/********************/

/* Aledade logo */
div.container.sidebar--closed--right > div.header.header--dashboard > div.header__inner > div.row > div:nth-child(1) {
    padding-left: 0rem;
}

/* Custom widget providing header nav */
div.container.sidebar--closed--right > div[role=main] > div.row.widget.widget--html.widget--html_standard {
    padding-left: 1rem; /* 16px */
    padding-top: 0.75rem; /* 12px */
}


/***************************************/
/* Learning Path Detail Sidebar Layout */
/***************************************/

/* "Learning Path Runs {date} */
.course__detail__runs {
    display: none;
}
/* text: "Register now to gain access to this course." */
.enroll--learning-path > p {
    display: none;
}
/* text: "Free", or price */
.enroll__price {
    display: none;
}
/* "Enroll Now" button */
.enroll__buy .btn {
    float: left;
}
/* "Gift This Learning Path" button */
.enroll__secondary-actions {
    display: none;
}

/******************/
/* Snippet Styles */
/******************/

.al-font-nunito {
    font-family: 'Nunito', sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

.al-font-bold {
  font-weight: bold;
}

.al-font-18 {
    font-size: 1.125rem !important; /* 18px */
    line-height: 1.28;
}

.al-font-14 {
    font-size: 0.875rem !important; /* 14px */
    line-height: 1.25;
}

.al-font-navy {
    color: #20254F !important;
}

.al-margin-0 {
    margin: 0 !important;
}

.al-headline-box {
    background-color: #6FD4F2;
    border-radius: 0.1875rem; /* 3px */
    padding: 0;
    max-width: 19.6875rem; /* 315px */
    position: relative;
}

.al-headline-link {
  min-height: 5.375rem; /* 86px */
  height: 100%;
  width: 100%;
  padding-block: 0.625rem; /* 10px */
  padding-inline: 1.25rem; /* 20px */
}

.al-flex-column {
    display: flex;
    flex-direction: column;
}

.al-flex-center-all {
    justify-content: center;
    align-items: center;
    text-align: center;
}

/**********************/
/* Global Site Layout */
/**********************/

/* Media queries to force a responsive centered layout */
@media(min-width: 1024px){.container{max-width:1024px;}}
@media(min-width: 1440px){.container{max-width:1440px;}}


/****************/
/* New Snippets */
/****************/

/* Declare color palette, refer to variables with 'var(--NAME)' */
:root {
  --color-primary: #003da5;         /* Aledade Blue */
  --color-primary-hover: #002270;    /* Darker Blue */
  --color-secondary: #F8F9FA;       /* Light Gray */
  --color-text: #ffffff;            /* White */
}


/* Define colorblock container */
.snippet.body-colorblock {
  display:flex;
  flex-direction:row;
  border-radius:15px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* Define vertical colorblock container */
.snippet.body-colorblock-vert {
  display:flex;
  flex-direction:column;
  border-radius:15px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* Border radius for top colorblock */
.colorblock-top {
  border-radius:15px 15px 0 0;
  padding: 10px 10px 10px 20px;
  height:auto;
}

/* Remove padding and margins for headers in top colorblock */
.colorblock-top > h1,h2,h3,h4,h5,h6 {
  padding:0;
  margin:0;
}

/* Border radius for bottom colorblock */
.colorblock-bottom {
  border-radius:0 0 15px 15px;
  padding:20px;
  height:auto;
  background-color:var(--color-secondary);
}

/* Border radius for left colorblock */
.colorblock-left {
  border-radius:15px 0 0 15px;
  padding:20px;
  height:auto;
}

/* Border radius for right colorblock */
.colorblock-right {
  border-radius:0 15px 15px 0;
  padding:20px;
  height:auto;
}

/* Sizing for 7% width block */
.colorblock-7 {
  flex:1;
  max-width:7%;
  flex-basis:7%;
  background-color:var(--color-secondary);
}

/* Sizing for 25% width block */
.colorblock-25 {
  flex:1;
  max-width:25%;
  flex-basis:25%;
  background-color:var(--color-secondary);
}

/* Sizing for 50% width block */
.colorblock-50 {
  flex:1;
  max-width:50%;
  flex-basis:50%;
  background-color:var(--color-secondary);
}

/* Sizing for 75% width block */
.colorblock-75 {
  flex:2;
  background-color:var(--color-secondary);
}

/* Color the highlighted block and text */
.colorblock-highlight {background-color:#003da5;}
.colorblock-highlight > * {color:var(--color-text);}
.colorblock-highlight a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}

.colorblock-highlight-green {background-color:#0d5257;}
.colorblock-highlight-green > * {color:var(--color-text)}
.colorblock-highlight-green a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight-green a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}

.colorblock-highlight-yellow {background-color:#976400;}
.colorblock-highlight-yellow > * {color:var(--color-text)}
.colorblock-highlight-yellow a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight-yellow a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}

.colorblock-highlight-pink {background-color:#905e74;}
.colorblock-highlight-pink > * {color:var(--color-text)}
.colorblock-highlight-pink a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight-pink a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}

.colorblock-highlight-countryblue {background-color:#437790;}
.colorblock-highlight-countryblue > * {color:var(--color-text)}
.colorblock-highlight-countryblue a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight-countryblue a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}

.colorblock-highlight-orange {background-color:#c63300;}
.colorblock-highlight-orange > * {color:var(--color-text)}
.colorblock-highlight-orange a:link {color:var(--color-text);font-weight:bold;text-decoration:underline;}
.colorblock-highlight-orange a:visited {color:var(--color-text);font-weight:bold;text-decoration:underline;}


/* Button with Primary Color background */
.snippet.body-button1 {
  cursor: pointer;
  background-color:var(--color-primary);
  border-color:var(--color-primary);
  border-radius:.25rem;
  border: 1px solid transparent;
  display:inline-block;
  text-align:center;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  font-weight:400;
  line-height:1.5;
  padding:6px 12px;
}


/* Button with Primary Color hover state */
.snippet.body-button1:hover {
  background-color:#002270;
}

/* Button with Secondary Color background */
.snippet.body-button2 {
  cursor: pointer;
  background-color:var(--color-secondary);
  border-radius:.25rem;
  border: 2px solid var(--color-primary);
  display:inline-block;
  text-align:center;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  font-weight:400;
  line-height:1.5;
  padding:6px 12px;
  font-size:1em;
  text-decoration:none;
}

/* Button with Secondary Color hover state */
.snippet.body-button2:hover {
  background-color:#e3e3e3;
}

/* Color links in buttons */
.snippet.body-button1 a {color:var(--color-text);}
.snippet.body-button1 a:hover {color:var(--color-text);text-decoration:none;}
.snippet.body-button2 a {color:black;}
.snippet.body-button2 a:hover {color:black;text-decoration:none;}

/* Flex container for body box */
.snippet.body-container {
  display:flex;
  flex-direction:row;
}

/* Sizing the image */
.element-icon {
  flex:0 1 10%;
}

/* Sizing and spacing the text */
.element-text {
  flex:2 2 80%;
  padding-left:30px;
}

/* Callout box with light background */
.snippet.callout-objectives {
  background-color:var(--color-secondary);
  border:2px solid var(--color-primary);
  height:auto;
  width:100%;
  font-size:1.2em;
  border-radius:15px;
  padding:10px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* Remove internal margin on callout box */
.snippet.callout-objectives p {
  margin:0;
}

.snippet.callout-highlight p {
  margin:0;
}

.snippet.callout-tip p {
  margin:0;
}


/* Callout box with highlight background */
.snippet.callout-highlight {
  background-color:var(--color-primary);
  color:var(--color-text);
  height:auto;
  width:100%;
  font-size:1.2em;
  border-radius:15px;
  padding:10px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.snippet.callout-tip {
  background-color:#FFF2CC;
  color:#000000;
  height:auto;
  font-size:1em;
  border-radius:5px;
  padding:10px;
  max-width: max-content;
}
  
/* Card grid container */
.snippet.card-container {
  display:grid;
  gap: 15px;
}

/* Set grid layout for cards */
.card-container.card-2col {grid-template-columns: 1fr 1fr;}
.card-container.card-3col {grid-template-columns: 1fr 1fr 1fr;}
.card-container.card-4col {grid-template-columns: 1fr 1fr 1fr 1fr;}

/* Style the cards for a card grid */
.card-content {
  display:flex;
  flex-direction:column;
  background-color:var(--color-secondary);
  border-radius:15px;
  padding: 10px 30px;
  flex:1;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 4px;
}

/* Style the colorblock card */
.card-colorblock {
  display:flex;
  flex-direction:column;
  background-color:var(--color-secondary);
  border-radius:15px;
  flex:1;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 4px;
}

.card-colorblock .colorblock-bottom {
  display:flex;
  flex-direction:column;
}

.card-colorblock .colorblock-bottom p {flex-grow:1;}

/* Card headers */
.card-header {
  font-size:1.5em;
  margin-bottom:1px;
  color:var(--color-primary);
  padding:5px;
}

/* Extra large card headers for statistics */
.card-header-stat{
  font-size:2.5em;
  color:var(--color-primary);
  text-align:center;
  padding:5px;
}

.card-header-custom {
  margin-bottom:1px;
  color:var(--color-primary);
  padding:5px;
  min-height:3.5rem;
}

/* Card body text */
.card-content  > p {
  text-align:left;
  padding:10px;
  flex-grow:1;
}

/* Large headers */
.header-large > h1 {
  font-size:2em;
  color:#003da5;
  margin-bottom:0.3em;
}

/* Medium Headers */
.header-medium > h2 {
  font-size:1.6em;
}

/* Small Headers */
.header-small > h3 {
  font-size:1.3em;
}

/* Sizing body images */
.body-image.image-full {max-width:100%;}
.body-image.image-xlarge {max-width:80%;}
.body-image.image-large {max-width:60%;}
.body-image.image-medium {max-width:40%;}
.body-image.image-small {max-width:20%;}


/* Figure tag for images */
.body-image figure {
  border: thin #c0c0c0 solid;
  display: flex;
  flex-flow: column;
  padding: 5px;
  margin-left: 0;
}

/* Figure tag captions */
.body-image figcaption {
  color: #000000;
  font: italic smaller sans-serif;
  padding: 3px;
  text-align: center;
}


/* Lightbox for expandable images */
.lightbox-full {
  /* Default to hidden */
  display: none;

  /* Overlay entire screen */
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  
  /* A bit of padding around image */
  padding: 1em;

  /* Translucent background */
  background: rgba(0, 0, 0, 0.8);
}

/* Unhide the lightbox when it's the target */
.lightbox-full:target {
  display: block;
}

.lightbox-full span {
  /* Full width and height */
  display: block;
  width: 100%;
  height: 100%;
  margin:auto;

  /* Size and position background image */
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.lightbox-thumbnail {
  max-height:40vh;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  
}

/* Style table headers */
.table-2col th, .table-3col th, .table-4col th, .table-5col th, .table-6col th, .table-7col th, .table-8col th {
  background-color:var(--color-primary);
	color:var(--color-text);
}


/* Reduce spacing between table list items */
.table-2col li {
  line-height:1.25em;
}

/* Reduce spacing between table list items */
.table-3col li, .table-4col li, .table-5col li, .table-6col li, .table-7col li, .table-8col li {
  line-height:1em;
}

/* Color full width table rows */
.table-full-row {
	background-color:var(--color-secondary);
}

/* Align first column text to top left of cell */
.table-2col td:first-child {
    text-align: left;
    vertical-align:top;
}

/* Set tables to equal columns */
.table-2col table, .table-3col table, .table-4col table, .table-5col table, .table-6col table, .table-7col table, .table-8col table {
  table-layout: fixed;
  text-align:left;
}

/* Float table icons to the right */
.table-icon {max-width:50px; float:right;margin-right:20px;}

/* Gentle background colors for table cells */
.table-green {background-color:#e5f0e4;}
.table-yellow {background-color:#FFF2CC;}
.table-red {background-color:#FFB6C1;}

/* Reduce indent on ordered lists */
.list-ordered > ul {
  margin-left:0;
}

/* Reduce indent on unordered lists */
.list-unordered > ul {
  margin-left:0;
}

/* Reduce indent on custom lists */
.list-custom > ul {
  margin-left:0;
}

/* Media query to vertically stack colorblocks on small screens and limit card grids to two columns*/
@media (max-width: 1023px){
  .snippet.body-colorblock {flex-direction:column;}
  .colorblock-left {max-width:100%;border-radius:15px 15px 0 0;}
  .colorblock-right {max-width:100%;border-radius:0 0 15px 15px;}
  .card-container.card-3col {grid-template-columns: 1fr 1fr;}
}

@media (max-width: 500px){
  .card-container.card-3col {grid-template-columns: 1fr;}
  .card-container.card-2col {grid-template-columns: 1fr;}
}

/* Expandable Box */
.expand-large {
  width: 100%;
  margin: 0 auto;
  margin-bottom:0.5em;
  border-radius: 5px;
  overflow: hidden;
}

/* Expandable Box - Summary */
.expand-large summary {
  padding: 1rem;
  display: block;
  padding-left: 2.2rem;
  position: relative;
  cursor: pointer;
  user-select: none;
}

/* Expandable Box - Chevron icon behavior */
.expand-large summary:before {
  content: '';
  border-width: .5rem;
  border-style: solid;
  border-color: transparent transparent transparent #000;
  position: absolute;
  top: 1.3rem;
  left: 1rem;
  transform: rotate(0);
  transform-origin: .2rem 50%;
  transition: .25s transform ease;
}

/* Expandable Box - Chevron icon behavior */
.expand-large[open] > summary:before {
  transform: rotate(90deg);
}

/* Expandable Box - Chevron icon behavior */
.expand-large summary::-webkit-details-marker {
  display:none;
}

/* Expandable Box - Styling the expanded section */
.expand-large > * {
  padding:1rem;
  margin:0;
}

/* Small Expandable Box - Summary */
.expand-small > summary {
  display: inline-flex;
  border: 1px solid #999999;
  border-radius:0.4em;
  padding:0.3em 1em 0.3em 1em;
  text-align:center;
  cursor: pointer;
}

/* Small Expandable Box - Chevron icon behavior */
.chevron {display:inline-block;}

/* Small Expandable Box - Chevron icon behavior */
.expand-small > summary .chevron {
  transition: rotate 0.5s;
}

/* Small Expandable Box - Chevron icon behavior */
.expand-small[open] > summary .chevron {
  rotate: 90deg;
  text-wrap: wrap;
}

/* Small Expandable Box - Styling the expanded section */
.expand-small > * {
  padding:1rem;
  margin:0;
}

/* Body CTA buttons */
.body-cta {
  background-color:var(--color-primary);
  color:var(--color-text);
  cursor: pointer;
}

/* Change resource lists to use the link icon */
.list-resources {margin:0;}
.list-resources li::marker {content: '🔗 ';font-size: 1.2em;}

/* Add horizontal scrollbar to wide tables on smaller screens */
@media (max-width: 1439px) {
    .table-wide {
      display: block;
      max-width: -moz-fit-content;
      max-width: fit-content;
      margin: 0 auto;
      overflow-x: auto;
      white-space: nowrap;
    }
}

.list-timeline {list-style: none;padding: 0;}
.time {list-style: none;padding: 0;}

.container-timeline p{
  font-size:1.2em;
  color: #4f4f4f;
  font-family: sans-serif;
  line-height: 1.5;
  margin-top:0.4rem;
  margin-bottom:0;
}

.list-timeline{
  margin-top: 2rem;
  border-radius: 12px;
  position: relative;
}

.list-timeline li{
  padding-bottom: 1.5rem;
  border-left: 1px solid #003da5;
  position: relative;
  padding-left: 20px;
  margin-left: 10px;
}

.list-timeline li:last-child {
  border: 0px;
  padding-bottom: 0;
  }

.list-timeline li:before {
    content: '';
    width: 15px;
    height: 15px;
    background: white;
    border: 1px solid #003da5;
    box-shadow: 3px 3px 0px #95bcff;
    border-radius: 50%;
    position: absolute;
    left: -10px;
    top: 0px;
}

.list-timeline .time{
  font-family: "Literata";
  font-weight: bold;
  font-size:1.2rem;

}