#search-container { text-align: center; padding: 1em; }

#search-input { padding: 0.5em; font-size: 16px; width: 80%; }

.search-dropdowns { width: 82%; text-align: center; margin: 30px auto; padding: 10px; }

select { padding: 8px; border: 1px solid #ccc; border-radius: 4px; min-width: 200px; font-size: 16px; margin: 5px; width: 90%; }

.pagination-button { padding: 8px 12px; border: 1px solid #ccc; border-radius: 4px; font-size: 16px; margin: 5px; background-color: #E20D39; cursor: pointer; color: #fff; font-weight: 600; }

.pagination-button:hover { background-color: #000; }

#employee-list { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; max-width: 900px; margin: auto; }

.employee-item { background-color: white; border: 1px solid #dcdcdc; border-radius: 7px; margin: 1em; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	background-image: url(https://www.chaffey.edu/strategic-communications/images/chaffey-logo/chaffey_logo-cmyk.jpg);
	background-size: 15%; background-repeat: no-repeat; background-position: top 20px left 10px; padding: 1em 1em 1em 5em; line-height: 1.5em; width: calc(50% - 2em); box-sizing: border-box; }

.employee-name { font-weight: bold; color: #e20d39; font-size: 18px; margin-bottom: 8px; }

.uid-link { display: block; margin-top: 0em; color: #e20d39; text-decoration: none; font-weight: bold; }

.uid-link:hover { text-decoration: underline; }

#pagination { text-align: center; margin-top: 1em; margin: 20px 20px 80px; }

@media (max-width: 768px) {
	.employee-item {  width: 100%; }
	select { width: 90%!important; }
	.search-dropdowns { width: 95%; }
}