@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600&display=swap');
@import url('https://p.typekit.net/p.css?s=1&k=fsj8xek&ht=tk&f=10875.32265&a=47850442&app=typekit&e=css');

@font-face {
  font-family: 'din-condensed';
  src: url('https://use.typekit.net/af/cfbead/0000000000000000000146b3/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3')
      format('woff2'),
    url('https://use.typekit.net/af/cfbead/0000000000000000000146b3/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3')
      format('woff'),
    url('https://use.typekit.net/af/cfbead/0000000000000000000146b3/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3')
      format('opentype');
  font-display: auto;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'din-condensed';
  src: url('https://use.typekit.net/af/f50d41/00000000000000003b9b2c84/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3')
      format('woff2'),
    url('https://use.typekit.net/af/f50d41/00000000000000003b9b2c84/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3')
      format('woff'),
    url('https://use.typekit.net/af/f50d41/00000000000000003b9b2c84/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3')
      format('opentype');
  font-display: auto;
  font-style: normal;
  font-weight: 300;
}

#root {
  font-family: 'Source Sans Pro', sans-serif;
  background-color: #eeeeee;
  font-size: 16px;
  color: #000000;
}

/* 
  COMMON COMPONENTS
*/

#root button.back-button {
  font-family: 'din-condensed', sans-serif;
  text-transform: uppercase;
  color: #1e1248;
  background: #ffffff;
  border: 2px solid #1e1248;
  box-shadow: none;
  font-size: 20px;
  line-height: 1.5rem;
  transition: none;
  height: 48px;
  padding: 0px 28px;
}

#root button.back-button:hover {
  color: #ffffff;
  background-color: #1e1248;
  border-color: #1e1248;
}

#root button.back-button .back-button-icon {
  display: none;
}

#root button.back-button .back-button-icon + span {
  margin-left: 0px;
}

#root button.save-button {
  font-family: 'din-condensed', sans-serif;
  text-transform: uppercase;
  font-size: 24px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  border: none;
  box-shadow: none;
  transition: none;
}

#root svg.heart-icon-outline {
  color: #ed6b5e;
}

#root svg.heart-icon-filled {
  color: #ed6b5e;
  fill: #ed6b5e;
}

#root span.credit-points-label {
  font-size: 16px;
}

#root div.banner-container {
  background-color: #000000;
}

#root span.banner-title {
  font-family: 'din-condensed', sans-serif;
  font-size: 54px;
  font-weight: 400;
  color: #5bc3e7;
  text-transform: uppercase;
}

@media (max-width: 768px) {
  #root span.banner-title {
    font-size: 36px;
  }
}

#root span.banner-text,
span.banner-description {
  font-size: 20px;
  font-weight: 600;
}

@media (max-width: 768px) {
  #root span.banner-text,
  span.banner-description {
    font-weight: normal;
    font-size: 16px;
  }
}

/* 
  HEADER
*/

#root svg.burger-menu-button {
  display: none;
}

#root div.navbar-links {
  flex-direction: row-reverse;
}

#root img.navbar-help-icon {
  display: none;
}

#root a.navbar-saved-credits-link {
  gap: 0;
  font-weight: 600;
}

#root a.navbar-help-link {
  font-weight: 600;
}

#root button.navbar-application-button {
  border-color: initial;
  color: initial;
  background: initial;
  text-shadow: initial;
  box-shadow: initial;
  border: initial;
  padding: initial;
  font-weight: 600;
  font-size: 16px;
}

#root button.navbar-application-button:hover > span {
  text-decoration: underline;
}

#root div.navbar-brand-logo-divider,
a.navbar-brand-logo-text {
  display: none;
}

#root span.navbar-saved-items-badge sup {
  background-color: #000000;
  right: 24px;
}

#root div.ribbon-header {
  display: none;
}

@media (max-width: 768px) {
  #root span.saved-label {
    display: none;
  }
}

/* 
  HOME > BANNER
*/

#root div.search-banner-text-container {
  gap: 32px;
}

/* 
  HOME > SEARCH CONTAINER
*/

#root span.institution-search-container,
span.course-search-container {
  border-radius: 2px;
}

div.institution-search-heading {
  margin: 16px 12px;
  font-family: 'din-condensed', sans-serif;
  font-size: 26px;
  font-weight: lighter;
  color: #262626;
}

#root div.search-inputs-container {
  gap: 20px;
}

#root div.search-inputs-container input.ant-input {
  font-size: 20px;
  line-height: 1.4;
}

@media (max-width: 768px) {
  #root div.search-inputs-container input.ant-input {
    font-size: 16px;
  }
}

/* 
  HOME > SEARCH RESULTS
*/

#root div.search-results {
  margin-top: 0;
}

#root div.tab-bar {
  border-bottom: 3px solid #5bc3e7;
}

#root div.ant-tabs-tab-active {
  transition: background-color 0.4s;
  background-color: #5bc3e7;
  padding-top: 11px;
  padding-bottom: 10px;
}

#root div.tab-pane-tab {
  display: flex;
  align-items: center;
  font-family: 'din-condensed', sans-serif;
  font-size: 24px;
  line-height: 32px;
  color: #1e1248;
  text-transform: uppercase;
}
@media (max-width: 768px) {
  #root div.tab-pane-tab {
    font-size: 18px;
  }
}

#root div.tab-pane-badge {
  background-color: transparent;
  border: 0px;
  font-size: 24px;
}
@media (max-width: 768px) {
  #root div.tab-pane-badge {
    font-size: 18px;
  }
}

#root div.tab-pane-badge::before {
  content: '(';
}

#root div.tab-pane-badge::after {
  content: ')';
}

#root div.ant-tabs-ink-bar-animated {
  display: none;
}

#root span.tab-pane-description {
  font-size: 18px;
  text-align: center;
}

#root svg.tab-pane-tooltip {
  display: none;
}

#root div.tab-pane-intro {
  padding: 28px 60px;
  background-color: #f7f7f7;
  justify-content: center;
}

@media (max-width: 768px) {
  #root div.tab-pane-content div.tab-pane-intro {
    display: none;
  }
}

/* 
  HOME PAGE > SOURCE INSITUTION NOT FOUND
*/

#root span.search-institution-not-found-description {
  font-size: 20px;
  line-height: 1.4;
  color: #262626;
}

/* 
  NO RESULTS PAGE
*/

#root div.no-results-container span.no-results-header {
  font-size: 28px;
  font-weight: 800;
}

#root div.no-results-container div.no-results-text-container {
  font-size: 20px;
}

#root div.no-results-button {
  display: none;
}

/* 
  CREDIT ITEM CARD
*/

#root div.credit-points-section button.credit-details-button {
  font-family: 'din-condensed', sans-serif;
  text-transform: uppercase;
  color: #1e1248;
  background: #ffffff;
  border: 2px solid #1e1248;
  box-shadow: none;
  font-size: 20px;
  line-height: 1.5rem;
  transition: none;
  height: 48px;
}

#root div.credit-points-section button.credit-details-button:hover {
  background: #1e1248;
  color: #ffffff;
  border-color: #1e1248;
}

#root div.credit-item-card {
  border-width: 0;
  background-color: #ffffff;
  border-radius: 0;
}
@media (max-width: 768px) {
  #root div.credit-item-card {
    background-color: #eeeeee;
    border-color: #c4cdd5;
    border-width: 3px 0px 0px 0px;
  }
  #root div.credit-item-card:last-child {
    background-color: #eeeeee;
    border-color: #c4cdd5;
    border-width: 3px 0px;
  }
}

/* 
  ARTICULATION CREDIT ITEM CARDS
*/

#root div.articulation-credit-item-list {
  gap: 12px;
}

#root div.articulation-credit-item-list div.credit-item-card:first-child {
  border-width: 0px;
}

#root .credit-points-section-top-row {
  gap: 0px;
}

/* 
  ARTICULATION SOURCE CREDENTIALS LIST
*/

#root span.source-credential-heading {
  font-size: 18px;
  font-weight: 600;
}

#root span.source-credential-subheading {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: normal;
  color: #262626;
}

/* 
  ARTICULATION TARGET COURSE LIST
*/
#root span.target-course-label {
  font-size: 18px;
  font-weight: 600;
}

#root span.institution-label,
span.cricos-label,
span.course-code-label {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: normal;
  color: #262626;
}

#root span.cohort-label,
span.admission-criteria-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.43;
  color: #6e6e6e;
}

#root span.view-course-link {
  font-size: 14px;
  color: #1e1248;
}

/* 
  PRECEDENT CREDIT ITEM CARDS
*/

#root div.precedent-credit-item-list {
  gap: 12px;
}

#root div.precedent-credit-item-list div.credit-item-card:first-child {
  border-width: 0px;
}

/* 
  PRECEDENT TARGET SUBJECTS LIST
*/

#root .available-in-course-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.43;
  color: #6e6e6e;
}

/* 
  SAVED CREDITS > BANNER
*/

#root div.saved-credits-banner-text-container {
  gap: 20px;
}

/* 
  SAVED CREDITS PAGE
*/

#root div.saved-credits-container {
  margin: 56px 12% 80px;
}
@media (max-width: 768px) {
  #root div.saved-credits-container {
    margin: 32px 0px 80px;
  }
}

@media (max-width: 768px) {
  #root div.saved-credits-nav-container {
    border-bottom: 3px solid #c4cdd5;
    margin: 0;
    padding: 0px 16px 16px;
  }
}

#root span.source-institutions-heading {
  font-family: 'din-condensed', sans-serif;
  font-size: 32px;
  line-height: 1.25;
  color: #262626;
}

#root div.banner-container div.saved-credits-back-button-container {
  display: none;
}

#root div.saved-credits-banner-container {
  margin: 80px 12%;
  gap: 32px;
}
@media (max-width: 768px) {
  #root div.saved-credits-banner-container {
    margin: 32px 20px;
  }
}

/* 
  CREDIT ITEM DETAILS > BANNER
*/

#root div.credit-details-banner-button-container {
  display: none;
}

#root div.credit-details-banner-container {
  margin: 80px 12%;
  gap: 32px;
}
@media (max-width: 768px) {
  #root div.credit-details-banner-container {
    margin: 32px 20px;
  }
}

#root div.credit-points-banner-text-container {
  font-size: 20px;
  font-weight: 600;
}

@media (max-width: 768px) {
  #root div.credit-points-banner-text-container {
    font-weight: normal;
    font-size: 16px;
  }
}

/* 
  ARTICULATION DETAILS
*/

#root div.articulation-details-container {
  margin: 56px 12%;
}
@media (max-width: 768px) {
  #root div.articulation-details-container {
    margin: 32px 0px 80px;
  }
}

#root div.articulation-details-card {
  background-color: #ffffff;
}

#root span.articulation-details-header {
  text-transform: uppercase;
  font-family: 'din-condensed', sans-serif;
  font-size: 32px;
  line-height: 1.25;
  color: #262626;
}

#root div.articulation-details-container,
div.articulation-details-header-card-container {
  gap: 32px;
}

#root div.articulation-details-arrow-container {
  background-color: transparent;
}

@media (max-width: 768px) {
  #root div.articulation-details-container div.credit-details-button-container {
    margin: 0px 20px;
  }
}

/* 
  ARRANGEMENT CARD
*/

span.required-credential-heading {
  font-size: 18px;
  font-weight: 600;
}

span.required-credential-subheading {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: normal;
  color: #262626;
}

/* 
  PRECEDENT DETAILS
*/

#root div.precedent-details-container {
  margin: 56px 12%;
}
@media (max-width: 768px) {
  #root div.precedent-details-container {
    margin: 32px 0px 80px;
  }
}

#root span.precedent-details-header {
  text-transform: uppercase;
  font-family: 'din-condensed', sans-serif;
  font-size: 32px;
  line-height: 1.25;
  color: #262626;
}

#root div.precedent-details-card {
  background-color: #ffffff;
}

#root span.credit-availability-heading,
span.conditions-heading,
span.valid-dates-heading {
  text-transform: uppercase;
  font-family: 'din-condensed', sans-serif;
  font-size: 32px;
  line-height: 1.25;
  color: #262626;
}

#root img.external-link-image {
  filter: initial;
}

@media (max-width: 768px) {
  #root div.precedent-details-container div.credit-details-button-container {
    margin: 0px 20px;
  }
}

/* 
  HELP > BANNER
*/

#root .help-banner-container {
  gap: 32px;
}

/* 
  HELP PAGE
*/

/* #root div.help-sections-container {
  margin: 0px 15% 80px;
} */

#root div.help-sections-container {
  margin: 56px 12% 80px;
}
@media (max-width: 768px) {
  #root div.help-sections-container {
    margin: 32px 20px 80px;
  }
}

#root span.help-section-heading {
  text-transform: uppercase;
  font-family: 'din-condensed', sans-serif;
  font-size: 32px;
  line-height: 1.25;
  color: #262626;
}

#root div.help-section {
  border: solid 1px #cccccc;
  background-color: #ffffff;
  padding: 0px 28px;
}

#root span.help-section-question {
  font-family: 'din-condensed', sans-serif;
  font-size: 26px;
  line-height: 1.08;
  color: #262626;
  text-transform: uppercase;
}

#root div.help-section-answers-container {
  gap: 28px;
}

#root span.help-section-answer {
  font-size: 18px;
  line-height: 1.56;
  color: #262626;
}

#root :focus-visible, 
#root :focus-visible, 
#root :focus-visible {
    outline: 3px solid #92c1ff;
    outline-offset: 2px;
    border-radius: 4px;
}