.programs-container {display: grid; grid-template-columns: repeat(auto-fit, 23%); gap: 1em; justify-content: start; direction: rtl; margin-inline: auto; max-width: 1800px;}
.program.card { background: #F5F5F9; padding: .5em; display: flex; flex-flow: column; justify-content: space-between; color: #000;}
.program.card .card-top { display: flex; justify-content: space-between; }
.program.card .card-top .program-registration-status { background: #dbe3f1; border-radius: 5px; display: flex; gap: .5em; padding: 0 0.5em; align-items: center; font-size: 14px; }
.program.card .card-top .program-registration-status:before { content: ''; width: 10px; height: 10px; background: red; border-radius: 100%; margin-top: -.1em; }
.program.card[data-registration_status='open'] .card-top .program-registration-status:before { background: #4AD6A4; }
.program.card .program-degree { color: #0892B4; font-weight: 400; margin: 1em 0; font-size: 80%; }
.program.card .program-title { font-weight: 500; font-size: 24px; line-height: 1em; color: #000; }
.program.card .card-middle { height: auto; font-size:24px}
.program.card .card-bottom { margin-top: 1em; border-top: 2px solid #DBE3F1; padding: 0.5em; font-size: 14px; min-height: 5em; }
.program.card .card-bottom > span:not(:last-of-type):after { content: ''; width: 5px; height: 5px; border-radius: 100%; margin: 0 0.5em; background: #9B9FAB; display: inline-block; }
.program.card .myFavorites a { outline: 0 !important; display: flex; align-items: center; }
.program.card:hover { box-shadow: 10px 10px 0px 0px rgba(161,248,253,1); }
.program.card:focus { outline: none !important;}

.univ-degree-tabs .univ-tabs-nav {border-bottom: 1px solid #19949c; margin-bottom: 1em; display: flex; gap: 1em;}
.univ-degree-tabs .univ-tabs-nav button, .univ-degree-tabs .univ-tabs-nav button:focus {background: transparent; color: #000; font-weight: 500; font-size: 24px; border:0; border-bottom: 3px solid transparent;}
.univ-degree-tabs .univ-tabs-nav button.active {color: #19949c;font-weight: 700; cursor:default; border-bottom: 3px solid #19949c;}

@media (max-width: 900px) {
  .programs-container {
    grid-template-columns: 1fr; /* one full-width column */
    justify-content: stretch;   /* fill the available space */
  }

  .programs-container > * {
    width: 100%;
    max-width: 360px;               /* card width limit */
  }
}