/* Container for BookShelf /*/

.oclc-bookshelf.bs-container {	
  max-width: 800px;
  margin: 0 auto;
  background:none;	
  overflow:hidden;
  margin-bottom:0px;
  text-align:center;  
  
}

/* Description /*/

.oclc-bookshelf.bs-container .bs-description {	
   margin-bottom:2px;  /* if the text is empty top box-shadow is not visible for image /*/ 	
}

/* Shelf /*/

.oclc-bookshelf.bs-container .bs-shelf{	
	position:relative;
	height:150px;
	margin-bottom:10% !important;	
}

/* Shelf - image /*/

.oclc-bookshelf.bs-container .bs-shelf-images {
   height:100%;
}

.oclc-bookshelf.bs-container .bs-shelf-image {
  width: 140px;
  height: 100%;		
  display: inline-block;  
  vertical-align:bottom;  
  position:relative;  
  margin-top:0px;
  margin-bottom:0px;
  margin-left:0px;
  margin-right:5px;
  max-width: 100%;
 
}

.oclc-bookshelf.bs-container .bs-shelf-image:hover {
   
}

.oclc-bookshelf.bs-container .bs-shelf-image:last-child {
  margin-right:0px; 
}

.oclc-bookshelf.bs-container .bs-shelf-image:first-child {
  margin-left:0px; 
}

.oclc-bookshelf.bs-container .bs-shelf-image a {
  position:static !important; /* remove conflict with with selected theme /*/
}

.oclc-bookshelf.bs-container .bs-shelf-image img {
  max-width:100%;
  max-height:100%;
  box-shadow: 0px 0px 3px #666666;  
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width:auto;
  margin:0 0 0 0;
    
}

.oclc-bookshelf.bs-container .bs-shelf-image img {		
	     -moz-transition-duration: .5s;	
		 -webkit-transition-duration: .5s;
		 -ms-transition-duration: .5s;	
		 	
}
			
.oclc-bookshelf.bs-container .bs-shelf-image img:hover {
		/*opacity: .6;/*/		
}


/* Image - textbox /*/

.oclc-bookshelf.bs-container .bs-shelf-image .bs-mask {	
	width:100%;
	height:100%;	
	pointer-events: none;
	overflow:hidden;
	position:relative;
}

.oclc-bookshelf.bs-container .bs-shelf-image .bs-textbox {
   position:absolute; 	
   background-color:#FFFFFF;
   width:100%;
   bottom:-100px;
   left:50%;  
    -webkit-transform: translateX(-50%);
   transform: translateX(-50%); 
   opacity:1; 
   padding:5px 0;
   pointer-events: none; 
       
}

.oclc-bookshelf.bs-container .bs-shelf-image .bs-textbox p {
  color:#000000;
  font-size:11px;
  font-weight:700; 
  margin:0 !important;
  line-height:1.5 !important; 
  padding:0 !important; 
  padding-left:6px !important; 
  padding-right:6px !important;
  
}



/* Shelf - background /*/

.oclc-bookshelf.bs-container .bs-shelf-background{
	position:absolute;
	border:0px solid #FF0000;
	left:0;
	bottom:-15px;
	width:100%;
	height:35px;
}

.oclc-bookshelf.bs-container .bs-shelf-background .bs-rectangle {
	    width:100%;
		height:100%;		
		border:0px solid #FFF000;
		position:absolute;
		top:0;
		left:0;		
		-webkit-transform: perspective(100px) rotateX(15deg);
        -webkit-transform-origin: 50% 100% 0;
		-ms-transform: perspective(100px) rotateX(15deg);
        -ms-transform-origin: 50% 100% 0;		
	    box-shadow: 0px 7px 1px rgba(0,0,0,0.25);			
		background: -moz-linear-gradient(top,  rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.06) 100%); 
		background: -webkit-linear-gradient(top,  rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.06) 100%); 
		background: linear-gradient(to bottom,  rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.06) 100%); 
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40000000', endColorstr='#0f000000',GradientType=0 );
}



/* Match each legacy category's saved dimensions and colors. */
.oclc-bookshelf.bs-container {
  max-width: var(--oclc-width, 1024px);
}
.oclc-bookshelf.bs-container .bs-shelf {
  height: var(--oclc-book-height, 165px);
}
.oclc-bookshelf.bs-container .bs-shelf-images { white-space: nowrap; }
.oclc-bookshelf.bs-container .bs-shelf-image {
  width: var(--oclc-book-width, 150px);
  margin-right: var(--oclc-gap, 5px);
}
.oclc-bookshelf.bs-container .bs-shelf-image:first-child { margin-left: 20px; }
.oclc-bookshelf.bs-container .bs-shelf-image:last-child { margin-right: 20px; }
.oclc-bookshelf.bs-container .bs-shelf-image img {
  box-shadow: 0 0 3px var(--oclc-color-shadow-image, #666666);
}
.oclc-bookshelf.bs-container .bs-shelf-image a:hover img {
  opacity: var(--oclc-opacity-hover, 0.7);
}
.oclc-bookshelf.bs-container .bs-shelf-image .bs-textbox {
  bottom: calc(-1 * var(--oclc-caption-height, 100px));
  background: var(--oclc-color-bcg-title, #ffffff);
  opacity: var(--oclc-opacity-title, 1);
  max-height: 100%;
  box-sizing: border-box;
  overflow-y: auto;
  white-space: normal;
  transition: bottom 0.2s;
}
.oclc-bookshelf.bs-container .bs-shelf-image .bs-textbox p {
  color: var(--oclc-color-text-title, #000000);
  font-size: var(--oclc-font-size, 9px);
}
.oclc-bookshelf.bs-container .bs-shelf-image:hover .bs-textbox,
.oclc-bookshelf.bs-container .bs-shelf-image:focus-within .bs-textbox,
.oclc-bookshelf.bs-container[data-always-title="true"] .bs-shelf-image .bs-textbox {
  bottom: 0;
  pointer-events: auto;
}
.oclc-bookshelf.bs-container .bs-shelf-background .bs-rectangle {
  background: linear-gradient(to bottom, var(--oclc-shelf-top, rgba(204,204,204,1)) 0%, var(--oclc-shelf-bottom, rgba(204,204,204,0.4)) 100%);
  box-shadow: 0 7px 1px var(--oclc-shelf-top, rgba(204,204,204,1));
}
.oclc-bookshelf.bs-container .bs-shelf-image .oclc-cover-source {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.oclc-bookshelf a:focus-visible { outline: 2px solid #0073aa; outline-offset: 2px; }
.oclc-bookshelf [hidden] { display: none !important; }
.oclc-bookshelf .oclc-status { font-size: 14px; font-weight: normal; }
.oclc-bookshelf .oclc-retry { margin: 10px; }
@media (prefers-reduced-motion: reduce) {
  .oclc-bookshelf.bs-container .bs-shelf-image .bs-textbox { transition: none; }
}