/* 
	sermons.PHP STYLES
*/	

.sermon-content {
	grid-area: sections;
	margin: 1em 0;
	width: 100%;	/* remove to default size */
	max-width: 1020px;
	justify-self: center;
}

	.sermon-content .sermon-controls {
		margin-bottom: 1em;
		padding-bottom: 1em;
		border-bottom: 4px double #000;
		display: flex;
		justify-content: space-around;
		align-content: stretch;
		align-items: stretch;
	}
		.sermon-content .sermon-controls .sermon-search {
			display: flex;
			align-items: center;
		}
			.sermon-content .sermon-controls .sermon-search .search-i {
				flex: 1;
				margin-left: 0.5em;
			}
				.sermon-content .sermon-controls .sermon-search #search-input {
					padding: 6px;
				  	font-size: 17px;
				  	border: none;
				  	width: 100%;
				}
			.sermon-content .sermon-controls .sermon-search .search-b {
				flex: 0;
			}	
				.sermon-content .sermon-controls .sermon-search #search-button {
					background: #ccc;
					padding: 6px 10px;
				  	font-size: 17px;
				  	border: none;
				  	cursor: pointer;
				  	white-space: nowrap;
				}
					.sermon-content .sermon-controls .sermon-search #search-button:hover {
						-webkit-box-shadow: inset 0px 0px 0px 2px rgb(43, 59, 186);
				    	-moz-box-shadow: inset 0px 0px 0px 2px rgb(43, 59, 186);
				    	box-shadow: inset 0px 0px 0px 2px rgb(43, 59, 186);
					}
		.sermon-content .sermon-controls .sermon-sort {
			display: flex;
			align-items: center;
		}
			.sermon-content .sermon-controls .sermon-sort #sermon-sort-list {
				padding: 6px;
			  	font-size: 17px;
			  	margin-left: 0.2em;
			}

	.sermon-content .sermon-item {
		background-color: #fff;
		margin: 0.5em auto;
		border: 1px solid black;
		display: grid;
		grid-template-columns: 4em auto auto;
		grid-template-rows: 2em 2em auto;
		grid-template-areas:
			"splay stitle sdate"
			"splay sseries spastor"
			"sinfo sinfo sinfo";
		cursor: pointer;	
	}
		.sermon-content .sermon-item .sermon-play {
			grid-area: splay;
			width: 100%;
			height: 100%;
			background-color: rgb(43, 59, 186);
			border-right: 1px solid black;
			content: url("../img/layout/play-white.png");
		}
			.sermon-content .sermon-item:hover .sermon-play {
				background-color: rgba(43, 59, 186, 0.8);
				content: url("../img/layout/play-black.png");
			}
		.sermon-content .sermon-item .sermon-title {
			grid-area: stitle;
			padding: 0.5em 0 0 0.5em;
		}
		.sermon-content .sermon-item .sermon-date {
			grid-area: sdate;
			padding: 0.5em 0.5em 0 0;
			text-align: right;
		}
		.sermon-content .sermon-item .sermon-pastor {
			grid-area: spastor;
			padding: 0 0.5em 0 0;
			text-align: right;
		}
		.sermon-content .sermon-item .sermon-series {
			grid-area: sseries;
			padding: 0 0 0.5em 0.5em;
		}
		.sermon-content .sermon-item .sermon-info {
			grid-area: sinfo;
			border-top: 1px solid black;
			padding: 0.5em;
		}

	.sermon-content .pagination {
		
	}	
		.sermon-content .pagination a {
			border: 1px solid black;
			text-decoration: none;
			background: white;
			padding: 0.2em 0.4em;
			margin: 0.3em auto;
			color: black;
		}
		.sermon-content .pagination a:hover {
			background: lightgray;
		}
	/* selected link cnt */
	.sermon-content .pagination a.active {
		background: lightgray;
	}	
	.sermon-content .page_count {
		margin-top: 0.5em;
	}