.search-box {
	background-color: rgb(238, 238, 238);
	width: 100%;
	max-width: 80rem;
	
	padding: 1em;
}
.search-box table.lotusFormTable, .search-box table.lotusFormTable > tbody > tr > td > table {
	width: 100%;
}
.search-box .lotusFormTitle h2 {
	color: #006391;
	font-weight: bold;
	font-size: 1.8rem;
	margin-top: 0.5em;
}
.search-box .lotusFormLabel {
	font-weight: bold;
	width: 15em !important;
}
.search-box input[type="radio"] {
	margin-left: 0.5em;
	margin-right: 0.25em;
}
.search-box tr.lotusFormFieldRow > td {
	padding-bottom: 0.5em;
}
.search-box .search-box-keywords {
	width: 90%;
}
input.dtsp-paneInputButton.search {
	padding: 6px !important;
}
.dtsp-panesContainer {
	width: 100%;
}
.dtsp-panesContainer button.clearButton {
	/* Fix the appearance of the first button in each SearchPane being lower than the others */
	position: relative;
	top: -7.5px;
}

body .searchpanes-toggle {
	margin-top: 1em;
	
	/* Make it look like a Notes-style section header */
	border: 0;
	border-top: 1px solid #0075ab;
	background: transparent;
	font-weight: bold;
	color: #0075ab !important;
	cursor: pointer;
	width: 100%;
	text-align: left;
	border-radius: 0;
	padding: 0;
	font-size: 1.2em;
	box-shadow: 0 0 0 0 transparent !important;
	
	&:focus, &:active, &:hover {
		background: transparent !important;
		outline: 0;
	}
}
.searchpanes-toggle:before {
	content: "\23F5  ";
}
.searchpanes-toggle.expanded:before {
	content: "\23F7  ";
}

.dataTable > thead {
	background-color: #0075ab;
	color:white;
}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
	opacity: .8; 
}
.dataTable .course-icon {
	font-size: 1.2em;
}

.course-table .dt-column-header {
	font-weight: bold;
}

body table.course-table {
	border-collapse: collapse;
	
	thead th, td {
		border: 1px solid #ddd;
	}
}

.courselist-preamble {
	/* Intended to match appearance of div.dt-container div.dt-layout-row */
	margin: 15px;
}


body div.dtsp-topRow div.dtsp-subRow1 button.dtsp-searchIcon {
	background-color: #0075ab;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
body div.dtsp-topRow div.dtsp-subRow1 button.dtsp-searchIcon span {
	background-image: url("search.png") !important;
}

/* Make sorting icons more visible */
body table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::before,
body table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order::before,
body table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::after,
body table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order::after {
	opacity: 0.4
}
body table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::before,
body table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order::after {
	opacity: 1
}

/* Add styling for number badges */
.badge {
	display: inline-block;
	min-width: 10px;
	padding: 3px 7px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	background-color: #777;
	border-radius: 10px;
	box-sizing: border-box;
}

/* Add Bootstrap-y styling for pagination */
.pagination {
	border-radius: 4px;
	
	a {
		color: #707070;
		background-color: white;
		padding: 6px 12px;
		line-height: 1.42;
		border: 1px solid #ddd;
		
	}
	li:first-child a {
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}
	li:last-child a {
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}
	li + li a {
		border-left-width: 0;
	}
	li.active a {
		background-color: #337ab7;
		border-color: #337ab7;
		color: white;
	}
}