:root{
	 --purple: #330072;
	 --pink: #924DA7;
	 --red: #DB2C39;
	 --gold: #F2A900;
	 --green: #6B7036;
	 --blue: #00ADFA;
	 --dblue: #0077A2;
	 --text: #444444;
	 --grey:#E6E6E6;
	 --hoverGrey: #F6F6F6;
	 --inactiveGrey: #585858;
}
 .full-description-fill .program-information.noImage{
	 width: 100%;
}
 .full-description-fill .program-information.noImage > *{
	 width: 100%;
	 max-width: 80%;
	 min-width: 400px;
	 float: none;
	 margin-left: auto;
	 margin-right: auto;
}
 .full-description-fill .program-information.noImage > a.close{
	 width: auto;
	 min-width: auto;
	 max-width: auto;
	 float: right;
}
 @media all and (min-width: 1024px) {
	 .program-information h1 a, .program-information h1{
		 font-size: 40px !important;
		 line-height: 50px !important;
	}
}
 .program-face h2{
	 text-transform: none;
}
/*Active Item*/
 #active-grid-item{
	 background-size: cover;
	 cursor: default;
}
 #active-grid-item:hover{
}
 .program-information{
	 padding-top: 94px;
}
 .program-information > a.close{
	 position: absolute;
	 top: 20px;
	 right: 20px;
}
 .program-information h1 a, .program-information h1{
	 font-size: 30px;
	 line-height: 40px;
	/* Min: 30px Max: 40px Min Width: 675px Max Width: 1024px Difference: 349 px */
	 font-size: calc(30px + 10 * ( (100vw - 675px) / 349) );
	 line-height: calc(40px + 10 * ( (100vw - 675px) / 349) );
	 font-family: 'Calluna Sans';
	 margin: 0;
	 margin-bottom: 20px;
	 text-decoration: none;
}
 .program-information .program-code p{
	 font-size: 15px;
	 line-height: 18px;
	 margin: 0;
	 font-family: 'Calluna Sans';
	 text-transform: uppercase;
}
 .program-information .program-code{
	 margin-bottom: 18px;
}
 .program-information .program-faculties a{
	 padding: 5px 12px;
	/*updated from 10 - 12*/
	 border: 1px solid #fff;
	 font-size: 12px;
	 line-height: 12px;
	 margin-right: 20px;
}
/*container for faculty, campus, available as*/
 .program-information .program-data{
	 margin-bottom: 20px;
	 overflow: hidden;
}
 .program-information .blurb{
	 font-size: 16px;
	 line-height: 24px;
	 margin-bottom: 36px;
}
/*End Active Item*/
/* Filter Menu */
 p.psuedofilter a{
	 text-decoration: underline;
	/*remove on mobile*/
	 color: #585858;
}
/*End Filter Menu */
/*Main Menu Style */
 #filters.openFilter .filterToggle, #filters.openFilter .filter{
	 background-color: #444444;
	 color: #fff;
}
 #filters.openFilter .filterToggle .icon, #filters.openFilter .filter .icon{
	 color: #fff;
}
 #filters.openFilter .filterToggle.open{
	 background-color: #E6E6E6;
	 color: #444444;
}
 #filters.openFilter .filterToggle.open .icon{
	 color: #444444;
	 transform: rotate(180deg);
	 top: 5px;
}
/*End Main Menu Style*/

/*Override the main-menu icon colour */
 .menu_button:hover .touch-button.icon.icon-toggleright, .menu_button .title{
	 color: #fff;
}
 #applied-filters .filterOption span i{
	 display: none;
}
 .specialFilterButton{
	 display: none;
}
 .specialFilterButton .indicatorSquare{
	 margin-left: -20px;
}
 #allBachDegrees.active i, #allDiplomaDegrees.active i, #allGradDegrees.active i, #allGradDiplomas.active i{
	 display: inline-block;
	 position: relative;
	 top: 3px;
	 left: -15px;
}
 #allBachDegrees.active .indicatorSquare, #allDiplomaDegrees.active .indicatorSquare, #allGradDegrees.active .indicatorSquare, #allGradDiplomas.active .indicatorSquare{
	 display: none;
}
 #programGrid, #filterGrid{
	 width: 100%;
	/* added 2018-09-06*/
	 padding-left: 20px;
	 padding-right: 16px;
}
 #filterGrid{
	 overflow: hidden;
}
 #programGrid{
	 margin: 15px;
	 display: grid;
	 grid-template-columns: repeat(4, 1fr);
	 grid-gap: 15px;
	 overflow: hidden;
	 margin-left: 0px;
	 margin-right: 0px;
}
 .program-grid-item *{
	 margin: 0;
}
 .program-grid-item{
	 height: 125px;
	 position: relative;
	 cursor: pointer;
	 background-color: #585858;
	/*default */
}
 #programGrid.activeItem .program-grid-item{
	 opacity: .2;
}
 #programGrid.activeItem .program-grid-item.item-active, #programGrid.activeItem .program-grid-item-active{
	 opacity: 1;
}
 .program-grid-item .program-face{
	 width: 100%;
	 height: 100%;
	 display: flex;
	 align-items: center;
	 z-index: 10;
}
 .program-grid-item:hover {
	 opacity: 1 !important;
}
 #programGrid:not(.activeItem) .program-grid-item:hover{
	 color: #FFF;
	 background: #585858;
}
 .program-grid-item .program-face h2{
	 padding: 0px 15px;
	 font-weight: normal;
	 color: #fff;
	 font-size: 18px;
	 width: 100%;
}
 .program-grid-item.expand-left .program-content{
	 left: 0;
}
 .program-grid-item.expand-from-right .program-content{
	 right: 0;
}
 .program-grid-item .program-content{
	 position: absolute;
	 top: 0;
	 width: 0px;
	 height: 0px;
	 overflow: hidden;
	 background: #585858;
	 transition: width .5s, height .5s;
	 cursor: default;
	 z-index: 1;
}
 .program-grid-item-active{
	 background-color: transparent !important;
}
 .grid-item-searchString, .program-grid-item-active .program-face{
	 display: none;
}
 .psuedofilter i{
	 display: none;
}
 .program-grid-item-active .program-content{
	 width: 200%;
	/* + 15px;
	 */
	 background-color: #585858;
	 color: #fff;
	 display: block;
	 z-index: 1000;
	 padding: 15px;
	 display: flex;
	 flex-grow: 1;
	 flex-direction: column;
	 height: auto;
	 padding-right: 0px;
	 box-sizing: content-box;
}
 #active-grid-item .program-content .close, .program-grid-item-active .program-content .close{
	 position: absolute;
	 right: 15px;
	 top: 15px;
	 color: #fff;
	 text-decoration: none;
	 z-index: 10;
	 cursor: pointer;
	 text-decoration: none;
}
 .image-tags{
	 clear: both;
	 margin-bottom: 15px;
	 overflow: hidden;
	/*fix for floaters*/
	 display: flex;
}
 .program-content .image-tags, .program-content h2, .content .wysiwyg-content{
	 padding-right: 15px;
}
 .program-grid-item-active .program-content.hasImage .program-image{
	 width: 100%;
	 max-width: 49.5%;
	 float: left;
}
 #active-grid-item .program-content.hasImage .program-image img, .program-grid-item-active .program-content.hasImage .program-image img{
	 max-width: 100%;
	 width: 100%;
}
 .program-grid-item-active .program-content.hasImage .filter-buttons{
	 width: 100%;
	 max-width: 49.5%;
	 float: right;
	 display: flex;
	 flex-direction: column;
	 flex-grow: 1;
	 padding-left: 15px;
	 align-items: flex-start;
	 justify-content: flex-end;
}
 .learnMore{
	 display: block;
	 clear: both;
	 width: 100%;
}
 .program-grid-item-active .program-content a.learnMoreBtn{
	 display: inline-block;
	 background-color: #fff;
	 color: #585858;
	 margin-top: 20px;
	 text-decoration: none;
}
 .program-grid-item-active .program-content .filter-buttons{
	 width: 100%;
	 max-width: 100%;
}
 .program-grid-item-active .program-content .filter-buttons a{
	 display: inline-block;
	 border: 1px solid #fff;
	 font-size: 12px;
	 margin-bottom: 8px;
}
 .program-grid-item-active .program-content.hasImage .filter-buttons a:last-child{
	 margin-bottom: 0;
}
 .program-grid-item-active .program-content .filter-buttons a:hover{
	 background-color: #fff;
	 color: #585858;
	 transition: all .2s;
}
 .program-grid-item-active .program-content a.learnMoreBtn, .program-grid-item-active .program-content .filter-buttons a{
	 padding: 5px 10px;
	 cursor: pointer;
}
 .program-grid-item-active.one-row .program-content{
	 width: 100%!important;
}
/** Legend **/
/*Filter Coulours and Block Colours */
 #allBachDegrees.active, #allDiplomaDegrees.active, #allGradDegrees.active, #allGradDiplomas.active{
	 color: #fff;
}
/*Option*/
 #active-grid-item.option .indent .innerdent{
	 border-color: #0077A2 transparent transparent;
}
 #applied-filters #filter_opt-Options > span, .program-grid-item.item-active.option, .option{
	 background-color: #0077A2;
}
/*Diploma*/
 #active-grid-item.diploma .indent .innerdent{
	 border-color: #924DA7 transparent transparent;
}
 #allDiplomaDegrees.active, #allGradDiplomas .indicatorSquare, #allDiplomaDegrees .indicatorSquare, #applied-filters #filter_legend_Diploma > span, .program-grid-item.item-active.diploma, .diploma, .program-grid-item.item-active.graduate-diploma, .graduate-diploma, .program-grid-item.item-active.graduate-Certificate, .graduate-Certificate{
	 background-color: #924DA7;
}

/*Certificate-same as diploma*/
 #active-grid-item.Certificate .indent .innerdent{
	 border-color: #924DA7 transparent transparent;
}
 #Certificate.active,  #Certificate .indicatorSquare, #applied-filters #filter_Certificate > span, .program-grid-item.item-active.Certificate,  .Certificate{
	 background-color: #924DA7;
}

/*Minor*/
 #active-grid-item.minors .indent .innerdent{
	 border-color: #DB2C39 transparent transparent;
}
 #applied-filters #filter_opt-Minors > span, .program-grid-item.item-active.minors, .minors{
	 background-color: #DB2C39;
}
/*Bachelor*/
 #active-grid-item.bachelor-degree .indent .innerdent{
	 border-color: #330072 transparent transparent 
}
 #allBachDegrees.active, #allBachDegrees .indicatorSquare, #applied-filters #filter_legend_Bachelors > span, .program-grid-item.item-active.bachelor-degree, .bachelor-degree, .program-grid-item.item-active.bachelor-degree.masters-degree, .bachelor-degree.masters-degree{
	 background-color: #330072;
}
/*Master*/
 #active-grid-item.masters-degree .indent .innerdent{
	 border-color: #F2A900 transparent transparent;
}
/*New */
 .item-active.option .indent .innerdent{
	 border-color: #0077A2 transparent transparent;
}
/*Diploma*/
 .item-active.graduate-diploma .indent .innerdent, .item-active.graduate-Certificate .indent .innerdent, .item-active.Certificate .indent .innerdent, .item-active.diploma .indent .innerdent{
	 border-color: #924DA7 transparent transparent;
}
/*Minor*/
 .item-active.minors .indent .innerdent{
	 border-color: #DB2C39 transparent transparent;
}
/*Bachelor*/
 .item-active.bachelor-degree .indent .innerdent{
	 border-color: #330072 transparent transparent 
}
/*Master*/
 .item-active.masters-degree:not(.bachelor-degree) .indent .innerdent{
	 border-color: #F2A900 transparent transparent;
}
 .item-active.doctorate .indent .innerdent{
	 border-color: #6B7036 transparent transparent;
}
/*end New*/
 #allGradDegrees.active, #allGradDegrees .indicatorSquare, #applied-filters #filter_legend_Masters > span, .program-grid-item.item-active.masters-degree, .masters-degree{
	 background-color: #F2A900;
	 color: #000;
}
.masters-degree:not(.bachelor-degree) .program-face h2{
	 color: #000;
}
 .masters-degree:hover .program-face h2{
	 color: #fff;
}
 .item-active.masters-degree:not(.bachelor-degree):hover .program-face h2{
	 color: #000;
}
/*Doctorate*/
 #active-grid-item.doctorate .indent .innerdent{
	 border-color: #6B7036 transparent transparent;
}
 #allGradDiplomas.active, #applied-filters #filter_legend_Doctorate > span, .program-grid-item.item-active.doctorate, .doctorate{
	 background-color: #6B7036;
}
 .legendItem{
	 display: block;
	 white-space: nowrap;
	 cursor: pointer;
	 line-height: 22px;
}
 .legendItem .block{
	 display: block;
	 height: 10px;
	 width: 10px;
	 float: left;
	 margin: 6px 4px 4px 4px;
	 padding: 0px;
}
 .legendItem:hover{
	 text-decoration: none;
	/*underline*/
}
 #legend{
     /* margin-left: -50px; */
	 margin-top: 20px;
	 /* display: grid; */
	 grid-template-columns: 1fr 1fr;
	 grid-template-rows: auto auto auto;
	 grid-column-gap: 20px;
}
/** End Legend **/
/*Filter Button*/
 #filterBtn{
	 width: 100%;
	 background-color: #e6e6e6;
	 height: 40px;
	 line-height: 40px;
	 text-align: center;
	 display: block;
	 position: relative;
	 cursor: pointer;
}
 #filterBtn i{
	 position: absolute;
	 right: 20px;
	 top: 0px;
	 -webkit-transform: rotate(0deg);
	 -moz-transform: rotate(0deg);
	 -o-transform: rotate(0deg);
	 -ms-transform: rotate(0deg);
	 transform: rotate(0deg);
	 transition: all 0.3s;
}
 #filterBtn.active{
	 background-color: #444;
	 color: #fff;
	 text-align: left;
	 padding-left: 10px;
}
 #filterBtn.active i{
	 top: -3px;
	 -webkit-transform: rotate(180deg);
	 -moz-transform: rotate(180deg);
	 -o-transform: rotate(180deg);
	 -ms-transform: rotate(180deg);
	 transform: rotate(180deg);
	 transition: all 0.3s;
}
 hr.non-mobile-divider{
	 margin-top: 15px;
}
/*End Filter Button */
/* Search */
 #searchPrograms{
	 position: relative;
	 margin-top: 30px;
	 height: 40px;
}
 #searchPrograms input{
	 width: 100%;
	 height: 40px;
	 position: absolute;
	 left: 0;
	 outline: 0;
	 border: 2px solid #e6e6e6;
	 border-radius: 40px;
	 padding-left: 20px;
	 color: #444;
	 box-shadow: none;
}
/*#search button{
	 */
	 #searchBTN:hover, #searchBTN{
		 right: 0px;
		 height: 40px;
		 width: 40px;
		 border-radius: 100%;
		 border: none;
		 z-index: 10;
		 position: absolute;
		 outline: 0;
		 text-align: center;
		 line-height: 40px;
		 font-size: 16px;
		 display: block;
		 background-color: #BCBCBC;
		 color: #444444;
		 overflow: hidden;
		 box-shadow: none;
		 padding: 0px;
	}
	/* End Search */
	 @media (min-width: 1271px){
		 #filterGrid{
			 display: grid;
			 grid-template-columns: 25% 25% 1fr 25%;
			 grid-template-rows: auto auto auto;
			 grid-template-areas: "header-text header-text . search" "header-text header-text . legend" "filterby filterby filterby filterby" "filters filters filters filters" "filterDrop filterDrop filterDrop filterDrop" "filterList filterList filterList filterList";
			 grid-column-gap: 5px;
		}
	}
	 @media (max-width: 1270px){
		 #filterGrid{
			 display: grid;
			 grid-template-columns: 65% 35%;
			 grid-template-rows: auto auto auto;
			 grid-template-areas: "header-text search" "header-text legend" "filterby filterby" "filters filters" "filterDrop filterDrop" "filterList filterList";
			 grid-column-gap: 5px;
		}
	}
	 @media (min-width: 900px){
		 #degreesFilterActive #graduate-filter{
			 padding: 20px 0px;
		}
		 #degreesFilterActive #undergraduate-filter{
			 padding: 20px 0px;
		}
		 #facultyFilterActive .filterButton:first-child{
			 margin-top: 20px;
		}
		 #facultyFilterActive .filterButton:last-child{
			 margin-bottom: 20px;
		}
		 #locationFilterActive .filterButton:first-child{
			 margin-top: 20px;
		}
		 #locationFilterActive .filterButton:last-child{
			 margin-bottom: 20px;
		}
		 #minorsOptionsFiltersActive .filterButton:first-child{
			 margin-top: 20px;
		}
		 #minorsOptionsFiltersActive .filterButton:last-child{
			 margin-bottom: 20px;
		}
		 #minorsOptionsFiltersActive .legendFilterButton:first-child{
			 margin-top: 20px;
		}
		 #minorsOptionsFiltersActive .legendFilterButton:last-child{
			 margin-bottom: 20px;
		}
	}
	/*on mobile, re-apply the padding which we applied to the buttons */
	 @media (max-width: 900px){
		 #minorsOptionsFiltersActive, #facultyFilterActive, #locationFilterActive, #degreesFilterActive{
			 padding: 20px 10px;
		}
	}
	 #programs-text{
		 grid-area: header-text;
	}
	 #searchPrograms{
		 grid-area: search;
	}
	 #legend{
		 grid-area: legend;
	}
	 #filters{
		 grid-area: filters;
	}
	 #filterBtn{
		 display: none;
	}
	 #filterByTag{
		 grid-area: filterby;
	}
	/*Same area */
	 #degreesFilterActive{
		 grid-area: filterDrop;
	}
	 #facultyFilterActive{
		 grid-area: filterDrop;
	}
	 #locationFilterActive{
		 grid-area: filterDrop;
	}
	 #minorsOptionsFiltersActive{
		 grid-area: filterDrop;
	}
	 #applied-filters{
		 grid-area: filterList;
	}
	 .filterToggle, .filter{
		/*width: 1fr;
		 */
		 background-color:#585858;
		 color: #fff;
		 min-height: 30px;
		 padding: 0px 10px;
		 padding-right: 30px;
		/*fix for the arrow */
		 cursor: pointer;
		 display: flex;
		 align-items: center;
		 justify-content: left;
		 position: relative;
	}
	 #OnlineFilter, #ShowAllFilter, .filterToggle{
		 background-color:#E6E6E6;
		 color: #444444;
		 font-size: 15px;
		 line-height: 18px;
	}
	 .filter i, .filterToggle i{
		 position: absolute;
		 right: 10px;
		 top: 8px;
		 -webkit-transform: rotate(0deg);
		 -moz-transform: rotate(0deg);
		 -o-transform: rotate(0deg);
		 -ms-transform: rotate(0deg);
		 transform: rotate(0deg);
		 transition: all 0.3s;
		 color: #444444;
	}
	 .filter.active i, .filterToggle.active i{
		 top: 5px;
		 -webkit-transform: rotate(180deg);
		 -moz-transform: rotate(180deg);
		 -o-transform: rotate(180deg);
		 -ms-transform: rotate(180deg);
		 transform: rotate(180deg);
		 transition: all 0.3s;
	}
	 .filterToggle.active, .filter.active{
		 color: #fff;
	}
	 .filterOption{
		 display: inline-block;
	}
	 #MinorsOptionsFilter{
		 min-width: 230px;
	}
	 #applied-filters{
		 margin: 15px 0;
	}
	 #applied-filters a.clear-all-filters{
		 display: none;
	}
	 #mobileFilters{
		 display: none;
	}
	 #applied-filters.hasFilter a.clear-all-filters{
		 display: inline-block;
		 border: 1px solid #330072;
		 background-color: #fff;
		 color: #330072;
		 padding: 5px 10px;
		 margin-right: 15px;
		 text-decoration: none;
		 font-size: 12px;
		 font-size: 12px;
	}
	 #applied-filters.hasFilter a.clear-all-filters:hover{
		 background-color: #330072;
		 color: #fff;
		 transition: 0.2s;
		 cursor: pointer;
	}
	 #filter_ONLINE.filterOption > span, #applied-filters .filterOption > span{
		 white-space: nowrap;
		 background-color: #444444;
		 display: inline-block;
		 color: #fff;
		 padding: 5px 10px;
		 text-transform: capitalize;
		 font-size: 12px;
	}
	 #applied-filters .filterOption{
		 margin-right: 5px;
		 margin-bottom: 10px;
		 float: left;
		 position: relative;
		 padding-right: 30px;
		 display: block;
	}
	 #applied-filters .filterOption .closeBtn{
		 position: absolute;
		 right: 10px;
		 top: 3px;
		 cursor: pointer;
		 text-decoration: none;
		 color: #444444;
	}
	/* options for the filter menu items*/
	 #filters{
		 display: grid;
		 grid-template-columns: repeat(6,1fr);
		 grid-column-gap: 5px;
		 justify-content: stretch;
		 grid-auto-rows: 1fr;
	}
	 #minorsOptionsFiltersActive, #facultyFilterActive, #locationFilterActive, #degreesFilterActive{
		 clear: both;
		 width: 100%;
		 background-color:#E6E6E6;
		 grid-template-columns: repeat(2, 1fr);
		 grid-column-gap: 15px;
		 display: none;
		 padding: 0px 10px;
		 grid-auto-rows: 1fr;
	}
	 #minorsOptionsFiltersActive{
		 grid-template-columns: 5fr 5fr !important;
	}
	 #locationFilterActive{
		 grid-template-columns: repeat(5, 1fr);
		 grid-auto-rows: 1fr;
	}
	 #minorsOptionsFiltersActive{
		 grid-template-columns: repeat(3, 1fr);
		 grid-auto-rows: 1fr;
	}
	 #minorsOptionsFiltersActive.active, #facultyFilterActive.active, #locationFilterActive.active{
		 display: block;
	}
	 #degreesFilterActive.active{
		 display: grid;
		/*we want two columns on desktop view*/
	}
	 .legendFilterButton:focus, .legendFilterButton, .filterButton:focus, .filterButton{
		 background-color: transparent;
		 border: 1px solid #585858;
		 margin-right: 10px;
		 margin-bottom: 8px;
		 color: #585858;
		 font-size: 12px;
		 cursor: pointer;
		 outline: 0;
		/*padding: 3px;
		 */
		 padding: 5px 10px 5px 10px;
		 box-shadow: none;
		 font-weight: normal;
	}
	 .legendFilterButton:focus, .legendFilterButton.selected, .legendFilterButton:hover, .filterButton:focus, .filterButton.selected, .filterButton:hover{
		 background-color: #585858;
		 color: #fff;
		 transition: all .2s;
	}
	 .legendFilterButton i.icon-checkmark, .legendFilterButton.selected i.icon-checkmark, .filterButton i.icon-checkmark, .filterButton.selected i.icon-checkmark{
		 display: none;
	}
	 .legendFilterButton.selected i, .filterButton.selected i{
		 display: block;
	}
	 .legendFilterButton a, .filterButton a{
		 z-index: 10;
	}
	 button:hover, button:focus, .button:hover, .button:focus{
		 background-color: transparent;
	}
	/*New Display Grid Item*/
	 #active-grid-item{
		 background-repeat: no-repeat;
		/* background-size: cover;
		 */
		 height: auto;
		/* allow to grow/shrink*/
	}
	/*fix to allow smaller viewport area to grow.*/
	 #active-grid-item .program-information{
		 height: 100%;
		 padding-bottom: 30px;
		 overflow: hidden;
	}
	 #active-grid-item .wrap{
		 display: none;
	}
	 #active-grid-item .program-content{
		 color: #fff;
		 padding: 20px;
		 position: relative;
		 width: 100%;
		 opacity: 0;
		 display: block;
		 height: auto;
	}
	#active-grid-item a, 
	.program-grid-item a {
		 color: #fff;
	}
	 #active-grid-item a.close{
		 float: right;
	}
	 #active-grid-item .program-meta a{
		 float: left;
		 margin-left: 0px;
		 margin-right: 15px;
	}
	 #active-grid-item .filter-buttons a{
		 border: 1px solid #fff;
		 margin: 10px;
		 margin-top: 0px;
		 padding: 10px 3px;
		 display: inline-block;
	}
	 #active-grid-item .program-content.hasImage .program-image{
		 float: left;
	}
	 #active-grid-item .program-content.hasImage .program-image img, .program-grid-item-active .program-content.hasImage .program-image img{
		 max-width: 270px;
	}
	 #active-grid-item .hasImage .filter-buttons a{
		 clear: both;
		 float: left;
	}
	/*End New Display Grid Item*/
	 .program-information{
		 width: 50%;
		 clear: both;
		 float: right;
		 display: block;
		 color: #fff;
		 padding-top: 90px;
	}
	 .program-information .close{
		 text-decoration: none;
	}
	 #active-grid-item, .program-information{
		/* min-height: 500px;
		 */
	}
	 .program-information > div{
		 clear: both;
	}
	 .program-data{
		 display: block;
	}
	 .hasImage .program-data{
	}
	 .program-information *{
		 font-size: 18px;
	}
	 .program-information h2, .program-information h3{
		 font-size: 18px;
		 font-weight: bold;
	}
	 .program-meta{
		 display: block;
		 align-self: flex-end;
	}
	 .program-meta div{
		 clear: both;
	}
	 .program-meta a{
		 margin-top: 10px;
		 border: 1px solid #fff;
		 margin-left: 10px;
		 padding: 3px 10px;
		 float: left;
		 text-decoration: none;
	}
	 .program-information{
		 float: right;
		 width: 44%;
		/*Image should be 56%*/
		 background-color: #1D1D1D;
		 padding-left: 50px;
		 padding-right: 50px;
	}
	 .program-information .blurb *{
		 display: none;
	}
	 .program-information .blurb p:first-child{
		 display: inline-block;
		 max-height: 60px;
		 overflow: hidden;
		 white-space: nowrap;
		 text-overflow: ellipsis;
	}
	 .program-information .blurb {
		/* height: 90px;
		 display: -webkit-box;
		 overflow: hidden;
		 text-overflow: ellipsis;
		 -webkit-line-clamp: 3;
		 -webkit-box-orient: vertical;
		 */
	}
	 #active-grid-item .indent, #active-grid-item .indent .innerdent{
		 width: 0;
		 height: 0;
		 border-style: solid;
	}
	 #active-grid-item .indent{
		 position: absolute;
		 border-width: 37.5px 37.5px 0 37.5px;
		 border-color: #ffffff transparent transparent transparent;
	}
	 #active-grid-item .indent .innerdent{
		/*grey*/
		 border-width: 26px 26.5px 0 26.5px;
		 border-color: #585858 transparent transparent transparent;
		 position: absolute;
		 left: -26.5px;
		/*half width of parent */
		 top: -52.5px;
		/*height of parent */
	}
	 .item-active .indent, .item-active .indent .innerdent{
		 width: 0;
		 height: 0;
		 border-style: solid;
	}
	 .item-active .indent{
		 position: absolute;
		 border-width: 37.5px 37.5px 0 37.5px;
		 border-color: #ffffff transparent transparent transparent;
		 bottom: -52px;
		 left: 50%;
		 z-index: 1000;
	}
	 .item-active .indent .innerdent{
		/*grey*/
		 border-width: 26px 26.5px 0 26.5px;
		 border-color: #585858 transparent transparent transparent;
		 position: absolute;
		 left: -26.5px;
		/*half width of parent */
		 top: -52.5px;
		/*height of parent */
	}
	 .learn-more-link p a{
		 background-color: #fff;
		 color: #585858 !important;
		 text-decoration: none;
		 padding: 3px 20px;
	}
	 .program-content .program-name{
		 display: none;
	}
	 #applied-filters{
		 display: none;
	}
	 #applied-filters.hasFilter{
		 display: block;
	}
	 @media (max-width: 900px){
		/*1024*/
		 #filterGrid {
			/*padding: 0px 12px;
			*/
			 display: grid;
			 grid-template-columns: 35% 30% 35%;
			 grid-template-rows: auto auto auto auto auto auto;
			 grid-template-areas: "header-text header-text header-text" "search . filterBtn" "filters filters filters" "filterList filterList filterList";
			 grid-column-gap: 5px;
		}
		 #filterBtn{
			 grid-area: filterBtn;
			 display: block;
			 text-align: left;
			 padding-left: 10px;
		}
		 #searchPrograms{
			 margin-top: 0;
		}
		 #filters{
			 margin-top: 10px;
			 grid-area: filters;
			 width: 100%;
			 clear: both;
			 display: grid;
			 grid-template-columns: 1fr;
			 grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto;
			 grid-template-areas: "degrees" "degreesO" "faculty" "facultyO" "location" "locationsActive" "minors" "minorsActive" "online" "all";
			 grid-column-gap: 0px;
			 grid-row-gap: 0px;
			 display: none;
			/*until activated?*/
		}
		 #filterGrid.showMobileMenu #filters{
			 display: grid;
		}
		/*Grid of Programs */
		 #programGrid{
			 grid-template-columns: repeat(3, 1fr);
		}
		 #active-grid-item .program-information.noImage{
			 padding-top: 65px;
		}
		 .program-grid-item-active .program-content{
			 width: 200%;
			 max-width: 200%;
		}
		 #programs-text{
			 max-width: 80%;
		}
		 #filterByTag, #legend {
			 grid-area: unset;
			 display: none;
		}
		 #degreesFilter{
			 grid-area: degrees;
		}
		 #degreesFilterActive{
			 grid-area: degreesO;
		}
		 #degreesFilterActive.active{
			 border-left: 2px solid #e6e6e6;
			 border-right: 2px solid #e6e6e6;
		}
		 #degreesFilterActive.active #graduate-filter{
			 border-bottom: none;
		}
		 #facultyFilter{
			 grid-area: faculty;
		}
		 #facultyFilterActive{
			 grid-area: facultyO;
		}
		 #LocationFilter{
			 grid-area: location;
		}
		 #locationFilterActive{
			 grid-area: locationsActive;
		}
		 #MinorsOptionsFilter{
			 grid-area: minors;
		}
		 #minorsOptionsFiltersActive{
			 grid-area: minorsActive;
		}
		 #OnlineFilter{
			 grid-area: online;
		}
		 #ShowAllFilter{
			 grid-area: all;
		}
		/*show the menu items*/
		 #filterGrid.showMobileMenu #undergraduate-filter, #filterGrid.showMobileMenu #graduate-filter, #filterGrid.showMobileMenu #OnlineFilter, #filterGrid.showMobileMenu #degreesFilter, #filterGrid.showMobileMenu #facultyFilter, #filterGrid.showMobileMenu #LocationFilter, #filterGrid.showMobileMenu #MinorsOptionsFilter, #filterGrid.showMobileMenu #ShowAllFilter{
			 display: block;
			 font-size: 15px;
			 line-height: 44px;
		}
		/* #filterGrid.showMobileMenu #undergraduate-filter, #filterGrid.showMobileMenu #graduate-filter, */
		 #filterGrid.showMobileMenu #OnlineFilter:hover, #filterGrid.showMobileMenu #degreesFilter:hover, #filterGrid.showMobileMenu #facultyFilter:hover, #filterGrid.showMobileMenu #LocationFilter:hover, #filterGrid.showMobileMenu #MinorsOptionsFilter:hover, #filterGrid.showMobileMenu #ShowAllFilter:hover{
			 background-color: #444;
			 color: #fff;
		}
		 #filterGrid.showMobileMenu #OnlineFilter:hover .icon, #filterGrid.showMobileMenu #degreesFilter:hover .icon, #filterGrid.showMobileMenu #facultyFilter:hover .icon, #filterGrid.showMobileMenu #LocationFilter:hover .icon, #filterGrid.showMobileMenu #MinorsOptionsFilter:hover .icon, #filterGrid.showMobileMenu #ShowAllFilter:hover .icon{
			 color: #fff;
		}
		/*hide the containers for menu options*/
		 #degreesFilterActive, #facultyFilterActive, #locationFilterActive, #minorsOptionsFiltersActive{
			 display: none;
			 background-color: #fff;
		}
		 #degreesFilter.active, #facultyFilter.active, #LocationFilter.active, #minorsOptionsFiltersActive.active{
			 display: block;
		}
		 #degreesFilter, #facultyFilter, #LocationFilter, #MinorsOptionsFilter, #ShowAllFilter, #degreesFilterActive, #facultyFilterActive, #locationFilterActive, #minorsActive{
			 width: 100%;
			 grid-template-columns: 1fr;
		}
		 #degreesFilterActive.active{
			 display: block;
			/*we want one columns on desktop view*/
		}
		 #filterGrid.showMobileMenu #filters.openFilter .filterToggle.open .icon{
			 top: -3px;
		}
		 #filterGrid.showMobileMenu p.psuedofilter a{
			 text-decoration: none;
		}
		/*menu stuff here */
		 .program-grid-item-active .program-content{
			 box-sizing: border-box !important;
		}
		 .filterToggle, .filter{
			 background-color: #E6E6E6;
			 border-bottom: 1px solid #585858;
			 color: #585858;
		}
		 #ShowAllFilter{
			 border-bottom: none;
		}
		 hr.non-mobile-divider{
			 display: none;
		}
		 button.legendFilterButton, button.specialFilterButton, button.filterButton{
			 background-color: transparent;
			 border: none;
			 text-align: left;
			 padding-left: 30px;
		}
		 button.legendFilterButton:hover, button.legendFilterButton.selected, button.specialFilterButton:hover, button.filterButton.selected, button.filterButton:hover{
			 background-color: #E6E6E6;
			 color: #444;
			 padding-left: 30px;
		}
		 button.specialFilterButton{
			 display: block;
			 outline: none;
			 width: 95%;
			 margin-bottom: 10px;
			 margin-right: 10px;
			 border-radius: 10px;
			 font-weight: normal;
			 font-size: 12px;
			 color: #585858;
		}
		 button.specialFilterButton i{
			 display: none;
		}
		 button.specialFilterButton .indicatorSquare{
			 display: inline-block;
			 height: 10px;
			 width: 10px;
			 float: left;
			 margin-right: 10px;
			 margin-top: 3px;
		}
		 #filterGrid.showMobileMenu .filter i, #filterGrid.showMobileMenu .filterToggle i{
			 top: 0px;
		}
		 .legendFilterButton.selected, .legendFilterButton, .specialFilterButton, .filterButton.selected, .filterButton{
			 border-radius:10px;
			 margin: 4px 9px !important;
			 padding-top: 4px;
			 padding-bottom: 4px;
			 min-height: 25px;
			 border: none;
			 box-shadow: none;
			 display: block;
			/*instead of flex*/
		}
		/*mobile*/
		 .legendFilterButton.active, .legendFilterButton:focus, .filterButton:active, .filterButton:focus{
			 margin: 4px 9px !important;
			 padding-left: 30px;
			 background-color: #fff;
			 color: #444444;
			 box-shadow: none;
		}
		 #applied-filters{
			 clear: both;
		}
		 button.legendFilterButton, button.filterButton{
			 width: 95%;
			 clear: both;
		}
		 #undergraduate-filter p, #graduate-filter p{
			 margin: 0;
			 line-height: 44px;
		}
		 button.legendFilterButton.selected i, button.filterButton.selected i{
			 display: inline-block;
			 position: absolute;
			 left: 15px;
		}
		 .hasFilter #mobileFilters{
			 display: block;
			 clear: both;
			 text-align: left;
			 margin-bottom: 15px;
			 margin-top: 15px;
			 overflow: hidden;
		}
		 #applied-filters.hasFilter a.clear-all-filters{
			 display: none;
		}
		 #applied-filters.hasFilter #mobileFilters a.clear-all-filters{
			 width: auto;
			 display: inline-block;
			 float: none;
			 text-align: center;
		}
		 #degreesFilterActive{
			 padding: 0;
		}
		 #undergraduate-filter {
		}
		 #graduate-filter{
			 border-bottom: 1px solid #585858;
		}
		 .psuedofilter{
			 position: relative;
			 margin: 0 !important;
			 width: 100%;
			 background-color: #fff;
			 color: #585858;
			 padding-left: 10px;
			 cursor: pointer;
		}
		 .mobileActive .pseudoContainer{
			 line-height: 25px;
		}
		 .psuedofilter i{
			 display: block;
			 position: absolute;
			 right: 10px;
			 top: 5px;
			 transform: rotate(0deg);
			 transition: all 0.3s;
		}
		 .psuedofilter.mobileActive i{
			 transform: rotate(180deg);
			 transition: all 0.3s;
		}
		 .pseudoContainer{
			 display: none;
			 height: 0px;
		}
		 #undergraduate-filter.mobileActive .pseudoContainer, #graduate-filter.mobileActive .pseudoContainer{
			 display: block;
			 height: auto;
			 clear: both;
		}
		 #filterGrid.showMobileMenu .legendFilterButton:focus, #filterGrid.showMobileMenu .legendFilterButton, #filterGrid.showMobileMenu .filterButton:focus, #filterGrid.showMobileMenu .filterButton{
			 border: none;
		}
		/*invert selection colours */
		 .showMobileMenu #filters.openFilter .filter, .showMobileMenu #filters.openFilter .filterToggle{
			 background-color: #E6E6E6;
			 color: #444444;
		}
		 .showMobileMenu #filters.openFilter .filterToggle .icon{
			 color: #444444;
		}
		 .showMobileMenu #filters.openFilter .filter.open, .showMobileMenu #filters.openFilter .filterToggle.open{
			 background-color: #444444;
			 color: #fff;
		}
		 .showMobileMenu #filters.openFilter .filterToggle.open .icon{
			 color: #fff;
		}
		 #filterGrid.showMobileMenu .legendFilterButton.selected i.icon-checkmark, #filterGrid.showMobileMenu .filterButton.selected i.icon-checkmark{
			 display: inline-block;
		}
		 a.clear-all-filters, a.clear-all-filters:hover{
			 text-decoration: none;
		}
		 #active-grid-item{
			 height: auto;
			 min-height: auto;
		}
		 .program-information{
			 height: auto;
			 min-height: auto;
		}
		 #active-grid-item .program-information{
			 clear: both;
			 width: 100%;
			 float: none;
			 padding: 28px;
		}
		 #active-grid-item .program-information .blurb{
			 height: auto;
		}
		 #active-grid-item > img{
			 display: block !important;
			 width: 100%;
		}
		 #active-grid-item .program-information > a.close{
			 top: auto;
		}
	}
	/*2 columns */
	 @media (max-width: 768px){
		 #filterGrid {
			 grid-template-columns: 40% 1fr 40%;
		}
		 #programGrid{
			 grid-template-columns: repeat(2, 1fr);
		}
		 .program-grid-item-active .program-content{
			 width: 200%;
			 max-width: 200%;
		}
		 #programs-text{
			 max-width: 100%;
		}
		 #active-grid-item{
			 background-image: none !important;
			 height: auto !important;
			/*overflow: hidden !important;
			 */
		}
		 #active-grid-item > img{
			 display: block !important;
			 width: 100%;
			 height: auto;
		}
		 #active-grid-item .program-information{
			 clear: both;
			 width: 100%;
			 padding: 15px 20px;
			 padding: 27px 37px;
			 padding-bottom: 40px;
			 height: auto !important;
			 overflow: hidden !important;
			 background-color:#1D1D1D;
			/* colour will be overridden at single column*/
		}
		 #active-grid-item .program-information .blurb{
			 height: auto;
		}
		/* #active-grid-item .program-information h1{
			 font-size: 22px;
			 line-height: 27px;
			 margin-bottom: 0px 
		}
		 */
		 #active-grid-item .program-information .program-code p{
			 font-size: 15px;
			 line-height: 18px;
		}
		 #active-grid-item .program-information .program-data .program-faculties a{
			 clear: both;
		}
	}
	/*1 column */
	 @media (max-width: 675px){
		 #filterGrid {
			 grid-template-columns: 49% 1fr 49%;
		}
		/*Grid of Programs */
		 #programGrid{
			 grid-template-columns: repeat(1, 1fr);
		}
		 #active-grid-item .program-information.noImage{
			 padding-top: 27px;
		}
		 #programGrid.activeItem .program-grid-item.item-active{
			 visibility: hidden;
			 height: 0px;
			 margin-top: -10px;
		}
		 #programGrid.activeItem #active-grid-item{
			 height: auto;
			 visibility: visible;
		}
		/* hide the notch? */
		 #active-grid-item .indent{
			 display: none !important;
		}
		 #active-grid-item{
			 overflow: hidden !important;
		}
		 .item-active .indent{
			 display: none !important;
		}
		/* .program-grid-item{
			 height: 106px;
		}
		 */
		/*hide the image*/
		 #active-grid-item > img{
			 display: none !important;
			 width: 100%;
			 height: auto;
		}
		 #active-grid-item.diploma .program-information{
			 background-color: #924DA7;
		}
		 #active-grid-item.minors .program-information{
			 background-color: #DB2C39;
		}
		 #active-grid-item.undergraduate .program-information{
			 background-color: #330072;
		}
		 #active-grid-item.doctorate .program-information{
			 background-color: #6B7036;
		}
		 #active-grid-item.masters-degree .program-information{
			 background-color: #F2A900;
		}
		 #active-grid-item.option .program-information{
			 background-color: #0077A2;
			/*#00ADFA;
			 */
		}
		 #applied-filters .filterOption{
			 clear: both;
			 margin-bottom: 20px;
		}
		/* .program-grid-item.bachelor-degree.minors .program-face{
			 background: #330072;
			 background: -moz-linear-gradient(45deg, #330072 0%, #db2c39 100%);
			 background: -webkit-linear-gradient(45deg, #330072 0%,#db2c39 100%);
			 background: linear-gradient(45deg, #330072 0%,#db2c39 100%);
			 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#330072', endColorstr='#db2c39',GradientType=1 );
		}
		 */
		 a.clear-all-filters{
			 font-size: 12px;
		}
		 #active-grid-item.masters-degree .program-information *{
			 color: #000;
		}
		 #active-grid-item.masters-degree .program-information .program-faculties a{
			 border-color: #000;
		}
		 #active-grid-item.masters-degree a{
			 color: #000;
		}
		 #active-grid-item.masters-degree .learn-more-link a{
			 border: 1px solid #000;
		}
	}
	 @media (max-width:600px){
		/*650*/
		 .program-data .program-image{
			 display: none;
		}
		 .program-content .program-name{
			 display: block;
			 width: 100%;
		}
		 #active-grid-item .program-information h1 a, #active-grid-item .program-information h1{
			 font-size: 30px !important;
			 line-height: 40px !important;
		}
	}
	 .row.universal.page{
		 padding-right: 5px;
	}

	/*ticket 163724*/
	 a.noLink:hover{
		 cursor: default !important;
	}
	/*ticket 163777*/
	 #applied-filters #filter_graduate-diploma.filterOption > span, #applied-filters #filter_diploma-.filterOption > span {
		 background-color: #924DA7 !important;
	}
	/*addition 2019-02-21*/
	 .searching #searchBTN{
		 overflow: visible;
	}
	 .searching #searchBTN:after{
		 content: 'x';
		 font-size: 15px;
		 position: relative;
		 top: -41px;
		 left: -40px;
		 width: 20px;
		 height: 20px;
		 display: inline-block;
		 z-index: 1000;
		 color: #444;
		 background-color: #e1e1e1;
		 border-radius: 20px;
		 line-height: 18px;
	}
	 .searching #searchBTN:hover:after{
		 color: #e1e1e1;
		 background-color: #444;
	}
	
    #active-grid-item .program-meta span, 
    .program-grid-item .program-meta span {
		 float: left;
		 margin-top: 10px;
		 margin-left: 0px;
		 margin-right: 20px;
		 padding: 5px 12px;
		 line-height: 12px;
		 font-size: 12px;
		 border: 1px solid rgb(255 255 255 / 30%);
		 color: #fff;
         background: rgb(255 255 255 / 4%);
	}
	
	@media (max-width: 675px){
    	#active-grid-item.masters-degree .program-meta span {
    	    border: 1px solid rgb(0 0 0 / 30%);
            background: rgb(0 0 0 / 4%);
    	}
	}