:root{
	--alphabet-width: 42px;
}

/*to be removed*/
.authorlist-temporary{
	/*padding: var(--margin-h) var(--margin-w);
	width: calc(100% var(--margin-w)*2)!important;*/
}
body[data-page=authorlist] #page-filter-button{
	display: none!important;
	pointer-events: none!important;
}
body[data-page=authorlist] #header-filter-button{
	/*pointer-events: none!important;*/
}
/*body[data-page=authorlist][data-filter=false] #header-filter-button:after{
	content: "+";
	font-size: var(--n2);
	line-height: var(--header-alt-height);
}
body[data-page=authorlist][data-filter=true] #header-filter-button:after{
	content: "-";
	font-size: var(--n2);
	line-height: var(--header-alt-height);
}*/



.letter-result-list-item{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.letter-result-list-item > *{
	width: 100%;
}
@media screen and (min-width: 501px){
	.letter-result-list-item > *{
		min-height: var(--n2h);
	}
}
@media screen and (max-width: 500px){
	.letter-result-list-item > *{
		min-height: var(--n3h);
	}
}

body[data-page=authorlist]{
	background-color: white!important;
}
.letter-wrapper-empty{
	background-color: transparent;
	max-height: 1px!important;
	min-height: 1px!important;
	padding: 0!important;
	margin: 0;
	margin-top: calc(var(--margin-h)*-0.5);
	pointer-events: none;
	border: none!important;
}
.letter-wrapper-empty *{
	display: none;
}
ul#author-pagination-list > li > div.scrolled{
	box-shadow: var(--shadow-line);
	background-color: var(--color-page);
}
.letter-wrapper.scrolled{
	/*background-color: red;*/	
}
/*main*/
.main-authorlist-wrapper div.letter-wrapper:last-of-type{
	border-bottom: none;
}
.main-authorlist-wrapper{
	/*height: calc(100vh - var(--header-height) + 0px);*/
}
.letter-wrapper{
	padding: var(--margin-h) var(--margin-w);
	justify-content: flex-start;
	align-items: flex-start;
	padding-bottom: calc(var(--margin-h)*3);
	border-bottom: var(--border-style);
	/*transform: translateY(-3px);*/
	margin-left: calc(var(--alphabet-width) + 1px);
	min-height: auto;
	/*min-height: 40vh;*/
}
.letter-wrapper > .letter-index{
	min-width: 120px;
	width: 120px;
}
.letter-wrapper .letter-result{
	width: 100%;
}
.authorlist-main_role{
	padding-left: calc(var(--margin-w)*3);
	width: calc(100% - var(--margin-w)*3);
}
/*pagination tool*/
#author-pagination-wrapper{
	position: fixed;
	width: var(--alphabet-width)!important;
	height: calc((100vh - var(--header-height)) - 0px);
	z-index: 4;
	pointer-events: all;
	top: var(--header-height);
	left: var(--aside-width);
	z-index: 10;
	border-right: var(--border-style);
}
ul#author-pagination-list{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/*padding-top: 5px;*/
	padding: var(--margin-h);
	transform: translateY(-3px);
}
ul#author-pagination-list > li{
	margin: 0;
	pointer-events: all;
	height: calc( (100vh - var(--header-height) - 1px - var(--margin-h)/2) / 26);
	transform: translateY(-2px);
}
ul#author-pagination-list > li > div{
	width: 30px;
	min-height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border-radius: 100%;
	border: none;
	box-shadow: none;
	cursor: pointer;
	outline: none;
}
ul#author-pagination-list > li > div.paginated{
	box-shadow: var(--shadow-line);
}
ul#author-pagination-list > li > div:hover{
	box-shadow: var(--shadow-line);
}
ul#author-pagination-list > li > div.paginated:hover{
	background-color: var(--color-page);
}

/*columns*/
.letter-result-list{
	column-count: 1;
	column-gap: calc(var(--margin-w)*1);
}
.letter-result-list-item{
	break-inside: avoid;
	margin-bottom: calc(var(--margin-h)*2);
}
/*primary breakpoints*/
@media screen and (max-width:500px){
	:root{
		--alphabet-width: calc(var(--logo-width) + var(--margin-w) - 0px);
	}
	/*.letter-index{
		font-size: var(--n3);
		line-height: var(--n3h);
		transform: translateY(0px)!important;
	}
	.letter-result-list-item.lineale-b{
		margin-left: calc(var(--margin-w)*0);
		font-size: var(--n3);
		line-height: var(--n3h);
	}*/
}
@media screen and (max-width:980px){
	ul#author-pagination-list{
		transform: translateY(3px);
	}
	:root{
		--alphabet-width: calc(var(--logo-width) + var(--margin-w) - 0px);
	}
	.letter-index{
		/*display: none;*/
		font-size: var(--n2);
		line-height: var(--n2h);
		/*transform: translateY(7px)!important;*/
		transform: translateX(5px) translateY(-5px)!important;
		text-align: right;
		padding-right: var(--margin-w);
	}
	body[data-page="authorlist"] aside #aside-content-scrollable.grid .section-content{}
	.letter-result-list{
		column-count: 1;
	}
	#author-pagination-wrapper{
		top: calc(var(--header-height) + var(--header-alt-height));
		height: calc((100vh - var(--header-height) - var(--header-alt-height)) - 0px);
	}
	body[data-page="authorlist"] #aside-content-scrollable.grid{
		display: flex;
		flex-direction: column;
		height: calc((100vh - var(--header-height) - var(--header-alt-height)) - 0px);
	}
	aside #aside-content-scrollable.grid .section-content{
		column-count: 1;
		column-gap: calc(var(--margin-w)*1);
		padding-bottom: var(--margin-h);
	}
	.letter-wrapper > .letter-index{
		/*opacity: 0;*/
		order: 2;
		pointer-events: none;
		min-width: calc(var(--margin-w)*4);
		width: calc(var(--margin-w)*4);
	}
	.letter-wrapper{
		border-bottom: var(--border-dotted-style);
		margin-bottom: calc(var(--margin-h)*0.5);
	}
	.letter-wrapper:first-of-type{
		margin-top: calc(var(--margin-h)*0.75);
	}
	.main-authorlist-wrapper{
		height: auto;
	}
	#author-pagination-wrapper{
		border-right: var(--border-dotted-style);
		border-left: none;
		left: 0;
	}
	ul#author-pagination-list > li{
		height: calc((100vh - var(--header-height)) / 29 - 0px);
	}
	#aside-content-scrollable{
		background-color: var(--color-page);
	}
}
@media screen and (min-width:591px){
	body[data-page=authorlist] aside #aside-content-scrollable.grid .section-content{
		column-count: 2;
	}
}
@media screen and (min-width:981px){
	body[data-page=authorlist] aside #aside-content-scrollable.grid .section-content{
		column-count: 1;
	}
}
@media screen and (min-width:740px){
	.letter-result-list{
		column-count: 2;
	}
}
@media screen and (min-width:981px){
	.letter-wrapper > .letter-index{
		min-width: 60px;
  		width: 60px;
	}
	.letter-result-list{
		column-count: 2;
	}
}
@media screen and (min-width:1191px){
	.letter-result-list{
		column-count: 2;
	}
}
@media screen and (min-width:1301px){
	.letter-wrapper > .letter-index{
		min-width: 120px;
  		width: 120px;
	}
	.letter-result-list{
		column-count: 2;
	}
}
@media screen and (min-width: 1521px){
	.letter-result-list{
		column-count: 3;
	}
}
@media screen and (min-width: 1721px){
	.letter-result-list{
		column-count: 3;
	}
}
@media screen and (min-width: 1921px){
	.letter-result-list{
		column-count: 4;
	}
}
@media screen and (min-width:2400px){
	.letter-result-list{
		column-count: 6;
	}
}
@media screen and (min-width:2900px){
	.letter-result-list{
		column-count: 7;
	}
}

/*vertical repsonsive situation*/
@media screen and (max-height: 700px){
	#author-pagination-wrapper{
		overflow-y: auto;
		/*border-right: var(--border-style);*/
		display: none!important;
	}
	.letter-wrapper{
		margin-left: 0!important;
		display: flex;
	}
	.letter-index{
		display: block!important;
		opacity: 1!important;
		font-size: var(--n3)!important;
    	line-height: var(--n3h)!important;
	}
	#author-pagination-list > li{
		height: auto!important;
		margin-bottom: calc(var(--margin-h)/2 + 0px)!important;
	}
}
@media screen and (min-height: 1480px){
	#author-pagination-list > li{
		max-height: 46.2px!important;
	}
}
@media screen and (max-width: 980px){
	#author-pagination-list .lineale-b {
	    font-size: var(--n3);
	    line-height: var(--n3h);
	}
	#author-pagination-list > li{
		height: calc((100vh - var(--header-height) - var(--header-alt-height)*1 - 4px) / 28.5)!important;
	}
}
