
.volumes h1{ clear: both; display: none; }

.volume.contracted{ 
	clear: both; 
	display: grid;
	
	height: 21px;
	
   	grid-auto-columns: minmax(0, 1fr);
  	grid-auto-flow: column;
	grid-row-gap: 0;
	grid-column-gap: 0;
	
	border: 1px solid #666;
	margin-bottom: 3px;
}

.volume.contracted .image{ 
	display: grid; 
	grid-template-columns: 1fr; 
}

.volume.contracted .file{ 
	width: 100%;
	height: 100%;
	background: #f8f8f8; 
}

.file{ opacity: .8; }

.volume.contracted .primary,
label.primary{ background: #93a9ff; }
.volume.contracted .secondary,
label.secondary{ background: #ffe093; }
.volume.contracted .research,
label.research{ background: #ff9393; }
.volume.contracted .poetry,
label.poetry{ background: #a7e57e; }
.volume.contracted .meta,
label.meta{ background: #777; }

.volume.contracted .nofile{ 
	background: #bbb; 
}

.volume.contracted .file.hover-active{ background: #d3d3d3 !important;  }
.volume.contracted .file.hover-active.primary{ background: #636aed !important; }
.volume.contracted .file.hover-active.secondary{ background: #edbe53 !important; }
.volume.contracted .file.hover-active.research{ background: #e85353 !important; }
.volume.contracted .file.hover-active.poetry{ background: #61ce46 !important; }
.volume.contracted .file.hover-active.meta{ background: #555 !important; }


label{ display: inline-block; margin-right: 3px; width: 12px; height: 12px; border: 1px solid #000; }


.volume.expanded{
	display: grid;
	height: 99vh;
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: repeat(auto-fill);
	grid-row-gap: 4px;
	grid-column-gap: 0;
	margin-bottom: 4em;
}

div.links{ margin-bottom: 5px; }

.volume.contracted .image.num_words_1{ background: #fff !important; }
.volume.contracted .image.is_partial{ background: #aaa !important; }
.volume.contracted .image{ background: #000; }

.volume.expanded .image{ display: grid; grid-template-columns: 1fr; }

.volume.expanded .file{ 
	width: calc(100% - 2px); height: calc(100% - 2px); 
	border-left: 1px solid #fff; 
	border-right: 1px solid #fff; 
	border-top: 1px solid #000;
	border-bottom: 1px solid #000; 
}

.volume.expanded .pedigree{ 
	background: #ff9393; 
	border-left: 1px solid #ff9393; 
	border-right: 1px solid #ff9393; 
	background: #ff9393; 
}

.volume.expanded .nofile{ background: #bbb; 
	border-left: 1px solid #bbb; 
	border-right: 1px solid #bbb; 
}

.volume.expanded .first{ border-left: 1px solid #000; }
.volume.expanded .last{ border-right: 1px solid #000; }


/* stop most double borders */
.volume.expanded .image .file:not(:first-child) {
    border-top: 1px solid transparent !important;
}
/*.first:only-child{ border-left: 1px solid transparent; }*/


.volume.expanded .file.hover-active{ background: black !important; border-color: black !important; }
