#searchContainer{display: flex; font-size:62px; margin-bottom:30px;}
	#searchContainer input{ border:10px solid #ececec; transition: border .3s ease;}
	#searchContainer input:focus{border:10px solid #666;}
	#searchContainer span{flex:1; line-height: 82px; margin:0 10px;}
	input.search{width:100%; display: block; outline:none; height:62px;  padding:10px; flex:1; font-size:30px;}
	
	.searchOptions{display:flex; flex-wrap: wrap; border-bottom: 1px solid #ececec; padding:0 0 20px 0;}
	.viewIcons{flex:0 1 50%;font-size:1.8em; font-weight: 200; text-align: right;}
	.viewIcons span{vertical-align: middle; margin: 0 0 0 10px; cursor: pointer;}
	.viewIcons span:hover{color:#ff7300;}
	.filterTitle{flex:0 1 50%;font-size:1.8em; font-weight:200;cursor: pointer;}
	.filterTitle:hover{color:#ff7300;}
	.filterTitle .ss-icon{vertical-align:middle; font-size:.4em; }
	.filterList{flex:1 0 100%; font-weight: 200; font-size:1em; padding:20px;  box-sizing: border-box; background:#f4f4f4;  }
	div.filterClose{flex:1 0 100%;cursor: pointer;}
	.filterList .ss-icon{float:right; cursor: pointer;}
	.filterList h3{font-weight:200; color:#999; font-size:1.5em; border-bottom:1px solid #ececec; margin-right:40px; padding-bottom:10px; text-transform: none!important;}
	



	.filterParSys{display:flex;}


.filters.section {display:flex;}
	
	.filterList.editFilterList { display: flex !important; }
	
	.filterList.editFilterList .filterParSys { width: 80%; }
	
	.disclaimer{width:100%; margin:0 0 20px 0; font-size:1em; font-weight:200;}
	
	div.showAll{font-weight:600;border: 1px solid #ccc; display: inline-block; padding:5px 10px; background: #fff; border-radius: 4px; margin:10px 1.5% 0 0; flex:0 1 10%; height:20px; text-align: center;}
	div.showAll:hover{border:1px solid #666;}
	
	.filterParSys .filters{flex:0 1 30%; margin:0 0 0 10px;}
.filterParSys .filters-clusters {flex:0 1 70%;}
	.key span > label, .clusters span > label{display:block; margin:0 0 15px 0; font-weight: 200; font-size:1.2em;position:relative; cursor:pointer; user-select: none;}
	.key span label > span, .clusters span label > span  {margin:0 2px 4px 0; font-weight:600; float:left;}
	
	.key label, .clusters label{ margin:0 0 5px 0;}
	.key span.checked label, .clusters span.checked label{font-weight:600; color:#ff7300;}
	.key span, .clusters span{margin:20px 0 0 25px; display: block;}
	
	.key input, .clusters input[type="checkbox"]{
		/*float:left;
		margin:3px 10px 20px 0;*/
		position: absolute;
		opacity: 0;
		cursor: pointer;
	}
	
	.radioCheckmark{
		position: absolute;
		top:2px;
		left:-25px;
		height:15px;
		width:15px;
		/*border-radius: 50px;*/
		border:1px solid #ccc;
		background-color:#ececec;
		
	}
	label:hover input ~ .radioCheckmark {
		background-color:#fff;
	}
	label input:checked ~ .radioCheckmark{
		background-color:#fff;
	}
	.radioCheckmark:after {
	  content: "";
	  position: absolute;
	  display: none;
	}
	label input:checked ~ .radioCheckmark:after {
	  display: block;
	}
	label .radioCheckmark:after {
	  left: 8px;
	  top: -8px;
	  width: 4px;
	  height: 17px;
	  border: solid #ff7300;
	  border-width: 0 4px 3px 0;
	  -webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
	  transform: rotate(45deg);
		/*top:3px;
		left:3px;
		border-radius: 50%;
		width:9px;
		height:9px;
		background: #ff7300;*/
	}

	
	.clusters{margin:0px 0 0 0;}
	
	
div.list article{margin:0 30px 0 0; border-bottom:1px solid #ccc; line-height:30px; padding:4px 0; font-size:16px;animation-name: listAni;animation-duration: .8s;}
div.list{list-style: none; display: grid;
	grid-template-columns: 50% 50%; margin:0 -30px 0 0}
	div.list .listAll{display:none;}
	
	.firelandsKey, .minorKey, .bachKey, .masterKey, .phdKey, .firelandsKey, .onlineKey, .certKey{border-radius: 50px; width:20px; height:20px; text-align: center; vertical-align: middle; font-size:10px;color:#000;line-height: 20px; background:#f7941d; display: inline-block;}
	
	
	span.minorKey{background:#6dcff6;}
	span.bachKey{background:#776df6}
	span.masterKey{background:#7cc576}
	span.phdKey{background:#f69679;}
	span.onlineKey{background: #fff799;}
	span.firelandsKey{background:#f26c4f;}
	span.certKey{background:#ffb477;}
	

	
	.list .certKey,
	.list .masterKey,
	.list .bachKey,
	.list .minorKey,
	.list .phdKey,
	.list .onlineKey,
	.list .firelandsKey,
	.list .certKey{float:right; margin-right:-5px; border:1px solid #fff; display: none;}
	
	.list article[data-filter~='bachelor'] .bachKey{display:block;}
	.list article[data-filter~='online'] .onlineKey{display:block;}
	.list article[data-filter~='minor'] .minorKey{display:block;}
	.list article[data-filter~='master'] .masterKey{display:block;}
	.list article[data-filter~='phd'] .phdKey{display:block;}
	.list article[data-filter~='firelands'] .firelandsKey{display:block;}
	.list article[data-filter~="certificate"] .certKey{display:block;}
    
	
	.hiddenKeywords{display:none;font-size:1px;color:#FFFFFF;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;}
	.progDescription{display:none;font-size:1px;color:#FFFFFF;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;}

	#list-search-filter .list article a img
	{ display:none; }
	
	#list-search-filter .list.card article a img
	{ display:block; }
	
	
	/* The animation code */
	@keyframes cardAni {
		from {opacity:0; transform: scale(.85);}
		to {opacity:1; transform: scale(1);}
	}
	
	@keyframes listAni {
		from {opacity:0; }
		to {opacity:1; }
	}

.noResults{width:100%; padding:20px; box-sizing:border-box;}
	
	div.list.card img{display:block;}
	
	div.list.card{display:flex; margin:0px -1.5% 0 0; grid-template-columns: none; align-items: stretch; flex-direction: row; flex-wrap: wrap;}
	/* STYLE TO HIDE ALL BUT FIRST 4 ARTICLES*/
	div.list.card.show-4 article:nth-of-type(n+5){
			display:none;
		}
	div.list.card.show-8 article:nth-of-type(n+9){
			display:none;
		}
	div.list.card.show-12 article:nth-of-type(n+13){
			display:none;
		}
	div.list.card.show-16 article:nth-of-type(n+17){
			display:none;
		}
	div.list.card.show-20 article:nth-of-type(n+21){
			display:none;
		}
	div.list.card.show-24 article:nth-of-type(n+25){
			display:none;
		}
	div.list.card.show-all {
			/* DUMMY CLASS */
		}
	/* */
	
	div.list.card article{padding:0px; margin:0 1.5% 1.5% 0;  box-sizing: border-box; flex:1; font-size:1.4em; line-height: 120%;  font-weight: 600; outline:2px solid #ececec; transition: border .3s linear; border-bottom:5px solid #fff; min-width: 279px; max-width:279px;flex-basis: 23.5%;animation-name: cardAni;animation-duration: .8s;}
		
	div.list.card article:hover{border-bottom:5px solid #ff7300;}
	
	
		div.list.card article section{padding:20px;}

	div.list.card article section .progDescription{display:block; font-size: 16px; color: #666; line-height: inherit; max-height: none; max-width: none; opacity: inherit; font-weight: 400; margin:15px 0 0 0;}
	
	div.list.card article section .progDescription:hover{color:#666; }
	
	div.list.card .listAll{display:block; width:100%; background:#ff7300; text-align: center; padding:15px 0; box-sizing: border-box; font-size:1.4em; margin:0 1.5% 0 0; font-weight:200; color: #fff; transition: background .5s ease; cursor: pointer;}
	div.list.card .listAll:hover{background:#d86202;}



	/*Horizontal Filter Styles*/
.filter--horizontal-style {display:flex; flex-direction:row; width:100%;margin:-10px 0 20px -15px;flex-wrap:wrap;}
.filter--horizontal-style h3{display:none;}
.filter--horizontal-style.key span > label{margin:5px 0 0 0;font-size:14px;}
.filter--horizontal-style.key span{margin:0 2px 0 20px;}

.filterParSys .filter--horizontal-style{margin:10px 0 10px -20px;}
.filterParSys .filter--horizontal-style h3{display:block; width:100%; margin:0 0 0 10px;}


	@media screen and (max-width: 1170px){
		div.list.card article{max-width:none;}
	}
	@media screen and (max-width: 700px){
		div.list{grid-template-columns: 100%;}
	}
	
	@media screen and (max-width: 500px){
		.viewIcons{font-size:1.5em;}
		input.search{font-size:5vw; height:auto; padding:10px;}
        .filterParSys{flex-direction:column;}
    .filterParSys .key span >label, .filterParSys .clusters span >label{font-size:14px;}
	}