@charset "utf-8";
/* CSS Document */

#nav-padding { margin-bottom: 10px; }

.rating-title { text-align: center; padding-top: 0px; margin-top: 0px; }

/* Faux Table for Media Information - Two Columns */
/* Creates two columns that float next to each other */
	.column1 {
		float: left;
		text-align: right;
		font-weight: 600;
		width: 15%;
		padding: 0px 10px 0px 15px;
	}

	.column2 {
		float: left;
		width: 80%;
		padding: 0px;
	}

	.row, .about-row { padding-bottom: 15px; margin: auto; }

	/* Clear floats after the columns */
	.row:after, .about-row:after {
		content: "";
		display: table;
		clear: both;
	}

	#smaller { 
		font-size: smaller; 
		font-weight: normal;
	}

/* Faux Table for Filter Data page - Four Columns */
	fieldset { 
		margin-top: 25px;
		padding: 20px;
}

	h3.legend { padding-top: 0px; margin-top: 0px; }

	.filter-column1 {
		float: left;
		width: 22%;
		padding: 0px 10px 0px 15px;
	}

	.filter-column1-2 { /* Equivalent of COLSPAN - Fills 2 columns */
		float: left;
		width: 45%;
		padding: 0px;
	}

	.filter-column1-only {  /* Equivalent of COLSPAN - Fills all 4 columns */
		float: left;
		width: 100%;
		padding: 0px;
	}

	.filter-column2 {
		float: left;
		width: 22%;
		padding-right: 10px;
	}

	.filter-column2-4 { /* Equivalent of COLSPAN - Fills 3 columns */
		float: left;
		width: 69%;
		padding: 0px;
	}

	.filter-column3 {
		float: left;
		width: 22%;
		padding-right: 10px;
	}

	.filter-column3-4 { /* Equivalent of COLSPAN - Fills 2 columns */
		float: left;
		width: 45%;
		padding: 0px;
	}

	.filter-column4 {
		float: left;
		width: 22%;
		padding: 0px;
	}

/* Column for Search Page */
	.search-column {  /* Only 1 Column */
		float: left;
		width: 70%;
		padding: 0px 20px;
		margin: 5px 125px;
		/* background-color: #FFBEA6;*/
		align-content: center;
	}

		.search-box { 
			border: 5px solid #FFBEA6;
			padding-top: 20px;
}
		.search-column1 {
			float: left;
			width: 50%;
		}

		.search-column2 {
			float: left;
			width: 50%;
		}

	.search-nopadding { padding-top: 0px; margin-top: 0px; }
	.search-padding { padding: 10px 0px 10px 0px; }
	.search-formfields { margin-right: 15px; margin-top: 10px; width: 50%; }
		select.search-formfields { font-size: 95%; }
	.search-required { color: #A30000; font-weight: 400; }

	input.search-button {
		background-color: #0779C5;
		color: white;
		font-weight: 600;
		font-size: 120%;
		padding: 15px 20px;
		margin: 0 auto;
		border: 1px solid #fff;
		cursor: pointer;
		border-radius: 8px;
		position: fixed;
		justify-content: center;
	}

/* Columns for About Database & Ratings Pages */
	.about-row { padding-top: 20px; }

	.about-column1, .about-column2, .about-column3, .main-column {
		float: left;
		/* width: 28.15%; */
		width: 32%;
		padding: 0px 15px 25px;
	}

	.about-column1 { background-color:#D4C4E9; }
	.about-column2 { background-color:#FFBFD3; }
	.about-column3 { background-color:#FFBEA6; }

	.rating-column {
		float: left;
		width: 25%;
		padding: 0px 5px 0px 0px;
	}
	.def-column {
		float: left;
		width: 70%;
		padding: 0px 5px;
	}



/* This would need more work since the DT element can't be bolded without disrupting the allignment of all following elements */
/* Testing on "test_one_record.php" */
dl {
	width: 100%;
	overflow: hidden;
	padding: 0;
	margin: 0
}
dt {
	float: left;
	/* text-align: right; */
	width: 25%;
	padding-bottom: 15px;
	padding-right: 10px;
	margin: 0px;
}
dd {
	float: left;
	width: 70%;
	padding-bottom: 15px;
	margin: 0px;
}

.record_label {
    text-align: right;
    font-weight: 600;
}

/* Don't think this is necessary any more */
/* Display-All Table */
table#display_all {
	border-collapse: collapse; /* makes a solid line instead || */
	width: 100%;
}

	table#display_all tr:nth-child(even) {
		background-color: #D4C4E9;
}

	table#display_all tr:nth-child(even) a:link, a:visited { color: #391a66; } /* Remove "visited" color? */
	table#display_all tr:nth-child(even) a:hover, a:active { color: #73173a; text-decoration: none; }

	table#display_all td, th {
		border: 1px solid #FFBFD3;
		padding: 8px;
}

	table#display_all th { text-align: center; color: #174e73; }
	table#display_all td { text-align: left; vertical-align: text-top; }

	#table_title { width: 100px; }

/* Not sure if this works to hide the caption from all but screen readers */
	caption.hidden {
		position: absolute;
		left: -10000px;
		top: auto;
		width: 1px;
		height: 1px;
		overflow: hidden;
}