/* #008656: green; #7fcecd: light blue; #5091cd: blue; #9c200d: red; #674a7d: purple; #938fc3: light purple; #7e4d11: brown; #ef553f:orange; #ffc520:yellow */
:root {
    --nu-purple: #4e2a84;
    --program-color-phd: #ffc520;
    --program-color-ms: #ef553f;
    --program-color-res: #7fcecd;
    --program-color-fel: #5091cd;
    --program-color-pro: #938fc3;
    --program-color-other: #008656;
}
/* Background-Image feature */
.background-select {margin-bottom: -3rem;}
.background-select .background-select-image {padding-bottom:0;}
.background-select .background-select-image-copy {padding: 1rem 2rem;}
.background-select h1 {color: var(--nu-purple); font-size: 1.5rem; font-weight:bold;}
.background-select p {margin-bottom:0;}
.programBtn{
    display: flex;
    align-items: center;
}
.programBtn .chevron{
    margin-right: .5em;
    min-width: 1em;
    opacity: .3;
    width: 1em;
}
.programBtn .chevron:has(.chevron-double){min-width: 1.2em; margin-right: .5em;}
.programBtn.phd .chevron-single, .programBtn.phd .chevron-double{fill: var(--program-color-phd);}
.programBtn.ms .chevron-single, .programBtn.ms .chevron-double{fill: var(--program-color-ms);}
.programBtn.res .chevron-single, .programBtn.res .chevron-double{fill: var(--program-color-res);}
.programBtn.fel .chevron-single, .programBtn.fel .chevron-double{fill: var(--program-color-fel);}
.programBtn.pro .chevron-single, .programBtn.pro .chevron-double{fill: var(--program-color-pro);}
.programBtn.other .chevron-single, .programBtn.other .chevron-double{fill:var(--program-color-other);}
.programBtn.md .chevron-single, .programBtn.md .chevron-double{fill: var(--nu-purple); }
.programBtn:hover .chevron {
    opacity: 1;
}
/*
.programBtn:hover::after {
    content: '\F27B';
    font-family: "bootstrap-icons";
    font-size: 2.5em;
    font-weight: 900;
    position: absolute;
}
.programBtn.md:hover::after {color: var(--nu-purple); }
.programBtn.phd:hover::after {color: var(--program-color-phd);}
.programBtn.ms:hover::after {color: var(--program-color-ms);}
.programBtn.res:hover::after {color: var(--program-color-res);}
.programBtn.fel:hover::after {color: var(--program-color-fel);}
.programBtn.pro:hover::after {color: var(--program-color-pro);}
.programBtn.other:hover::after {color:var(--program-color-other);} 
.programBtn:hover .program {
    padding-left: 2.5em
}
*/
.program {
    background-color: var(--bs-gray-200) !important;
    position: relative;
    height: 8em;
    text-align: left;
    width: 100%;
}
.program .btnTxt {font-size:1.2em}
.program .type {
    bottom: 0;
    height: 4px;
    position: absolute;
    right: 0;
    width: 100%;
} 
.filter .btn {color: #000; padding:1em; border: 1px solid #ccc;}
.filter .btn.active.all {background-color: #ccc;}
.filter .btn.active.md {border-color: var(--nu-purple); color: #fff}
.filter .btn.active.phd {border-color: var(--program-color-phd)}
.filter .btn.active.ms {border-color: var(--program-color-ms); color: #fff}
.filter .btn.active.res {border-color: var(--program-color-res);}
.filter .btn.active.fel {border-color: var(--program-color-fel);}
.filter .btn.active.pro {border-color: var(--program-color-pro);}
.filter .btn.active.other {border-color: var(--program-color-other); color: #fff}

.filter .btn.active.md,.type .md {background-color: var(--nu-purple);}
.filter .btn.active.phd,.type .phd {background-color: var(--program-color-phd);}
.filter .btn.active.ms,.type .ms {background-color: var(--program-color-ms);}
.filter .btn.active.res,.type .res {background-color: var(--program-color-res);}
.filter .btn.active.fel,.type .fel {background-color: var(--program-color-fel);}
.filter .btn.active.pro,.type .pro {background-color: var(--program-color-pro);}
.filter .btn.active.other,.type .other {background-color:var(--program-color-other);}
/* offcanvas */
.offcanvas-title {line-height: 1.2;}
.offcanvas-header, .offcanvas-body, .offcanvas-footer {padding-left:1.5em;}
.offcanvas .offcanvas-body {line-height: 1.3em;}
.offcanvas.program-details {background: var(--bs-gray-200); border: none; width: 90% !important; max-width: 700px; padding: 0;}
.offcanvas.program-details h3 { color: var(--nu-purple) !important}
.offcanvas.program-details .type div {
    height: .7em;
}
.offcanvas.program-details img {width: 200px;}
.offcanvas.program-details .offcanvas-header .filter .btn-close {
  position: absolute;
  right: 1em;
  top: 1em;
}
/* pagination */
#main-content .pagination {
 min-height:3rem
}
#main-content .simple-pagination {
 overflow:hidden;
 margin-bottom:1rem
}
#main-content .simple-pagination ul {
 list-style:none;
 padding:0;
 margin:0
}
#main-content .simple-pagination li {
 background:none;
 padding:0;
 width: inherit;
}
#main-content .light-theme a,
#main-content .light-theme span {
 background:#fff;
 border:1px solid #ccc;
 border-radius:3px;
 box-shadow:0 1px 2px rgba(0,0,0,0.2);
 color:#716c6b;
 font-size:16px;
 display:inline-block;
 margin:0 .4em .3em 0;
 padding:0 7px;
 line-height:24px;
 text-align:center;
 text-decoration:none;
 min-width:14px
}
#main-content .light-theme a:hover {
 text-decoration:none;
 background:#4e2a84;
 color:#fff
}
#main-content .light-theme .current {
 background:#6d6e71;
 color:#fff;
 border-color:#54585a;
 box-shadow:0 1px 0 #fff,0 0 2px rgba(0,0,0,0.3) inset;
 cursor:default
}
#main-content .light-theme .ellipse {
 background:none;
 border:none;
 border-radius:0;
 box-shadow:none;
 font-weight:bold;
 cursor:default
}
/* Desktop Layout: 768px to a max of 999px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width:768px) {
.offcanvas.program-details {width: 75% !important}  
}
@media (min-width: 992px) {
      
}
@media only screen and (min-width:1000px) {

}