/*
	Styling for the DisplayLibraryView page view.
 */
.library_display_container {
	padding: 10px;
	box-sizing: border-box;
	overflow-x: hidden;
}

.library_display_container .manga_series_wrap {
	margin: 5px;
	padding: 10px;
	width: 300px;
	display: inline-block;
	background-color: #2b2b2b;
	vertical-align: top;
}

.library_display_container .manga_series_wrap:hover {
	background-color: var(--hightlight_bg);
}

.library_display_container .manga_series_wrap .title {
	position: relative;
	margin: 0;
	height: 3.06em;
	display: block;
	color: #b9b9b9;
	overflow: hidden;
	text-align: center;
	font-family: Arial;
	font-size: 1.63em;
	white-space: nowrap;
}

.library_display_container .manga_series_wrap .title .elipsis {
	display: inline-block;
}

.library_display_container .manga_series_wrap .title .title_expand {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	min-height: 100%;
	display: none;
	background-color: var(--hightlight_bg);
	color: #5f3d00;
	white-space: normal;
}

.library_display_container .manga_series_wrap .title::before {
	width: 0;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
	content: '';
}

.library_display_container .manga_series_wrap:hover .title {
	color: #5f3d00;
}

.library_display_container .manga_series_wrap:hover .title .title_expand {
	display: block;
}

.library_display_container .manga_series_wrap a {
	display: block;
	text-decoration: none;
}

.library_display_container .manga_series_wrap a img {
	width: 100%;
	height: 425px;
	vertical-align: top;
}

.library_display_container .manga_series_wrap a .placeholder {
	height: 425px;
	border: 2px dashed #b28c00;
	text-align: center;
}

.library_display_container .manga_series_wrap a .placeholder::before {
	width: 0;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
	content: '';
}

.library_display_container .manga_series_wrap a .placeholder img {
	width: 65%;
	height: auto;
	display: inline-block;
	vertical-align: middle;
}

.nothing_to_show {
	position: absolute;
	top: calc(49px + 50% - 2em);
	right: 0;
	bottom: 0;
	left: 0;
	padding: 0 20px;
	color: #676767;
	text-align: center;
	font-family: Consolas;
	font-size: 4em;
}

@media all and (max-width: 2000px) {
	.library_display_container {
		display: grid;
		grid-column-gap: 10px;
		grid-row-gap: 10px;
		grid-template-columns: calc((100% / 6) - 8.33px) calc((100% / 6) - 8.33px) calc((100% / 6) - 8.33px) calc((100% / 6) - 8.33px) calc((100% / 6) - 8.33px) calc((100% / 6) - 8.33px);
	}
	
	.library_display_container .manga_series_wrap {
		margin: 0;
		width: auto;
	}
	
	.library_display_container .manga_series_wrap .title {
		height: 4vw;
		font-size: 1.3vw;
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 20vw;
	}
}

@media all and (max-width: 1600px) {
	.library_display_container {
		grid-template-columns: calc((100% / 5) - 8px) calc((100% / 5) - 8px) calc((100% / 5) - 8px) calc((100% / 5) - 8px) calc((100% / 5) - 8px);
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 24.2vw;
	}
}

@media all and (max-width: 1100px) {
	.library_display_container {
		grid-template-columns: calc((100% / 4) - 7.5px) calc((100% / 4) - 7.5px) calc((100% / 4) - 7.5px) calc((100% / 4) - 7.5px);
	}
	
	.library_display_container .manga_series_wrap .title {
		font-size: 1.5vw;
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 30.34vw;
	}
}

@media all and (max-width: 768px) {
	.library_display_container {
		grid-template-columns: calc((100% / 3) - 6.7px) calc((100% / 3) - 6.7px) calc((100% / 3) - 6.7px);
	}
	
	.library_display_container .manga_series_wrap .title {
		height: 5.5vw;
		font-size: 1.9vw;
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 37.66vw;
	}
	
	.nothing_to_show {
		top: calc(50% - 1.5em);
		font-size: 3em;
	}
}

@media all and (max-width: 500px) {
	.library_display_container {
		grid-template-columns: calc((100% / 2) - 5px) calc((100% / 2) - 5px);
	}
	
	.library_display_container .manga_series_wrap .title {
		height: 6.5vw;
		font-size: 2.6vw;
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 53.24vw;
	}
	
	.nothing_to_show {
		top: calc(50% - 1em);
		font-size: 2em;
	}
}

@media all and (max-width: 320px) {
	.library_display_container {
		grid-template-columns: 100%;
	}
	
	.library_display_container .manga_series_wrap .title {
		height: 13vw;
		font-size: 5vw;
	}
	
	.library_display_container .manga_series_wrap a img,
	.library_display_container .manga_series_wrap a .placeholder {
		height: 113.64vw;
	}
}
