/* CSS for BCRA Bookshop. Copyright (c) 2015 David Gibson. No licence should be inferred. */


P.inlineP {
   position:relative;	/* to act as anchor for other elements */
   display:inline;	/* to make <p> behave like a series of <img>; <div>&<span> seem not to work in this context */
   line-height: normal !important;  /* added 21-Feb-2024 for the new bookshop page */
   }

 IMG.covers {			/* front cover images used on COVERS and bookshop/INDEX pages */
 width: 200px;
 height: 283px;
 border: black solid 1px; 
 margin: 25px 15px 60px 0px;
}

SPAN.textInfo {			/* text description that pops-up on bookshop/INDEX page */
  visibility: hidden;
  text-align:center;
  font-size: 9pt; 
  border:black solid 2px;
  border-radius:3px; 
  background-color:#FFFFAA;
  position:absolute;
  left:0px;
  bottom:70px;
  width:180px;
  margin-left:5px;		/* to centre the element */
  padding: 5px;
  opacity: 0;			/* i.e. fully invisible - will be altered by JS fading routine */
  transition: opacity 0;	/* i.e. no transition - will be altered by JS fading routine */
  z-index: 2;
}


SPAN.banner {			/* Banner info that overlays cover images on bookshop/INDEX page */
  text-align:center;
  font-size: 10pt;
  font-weight: bold;
  border: red solid 1px;
  border-radius:3px; 
  padding:5px;
  background-color:yellow;
  position:absolute;
  left:0px;
  /* bottom:300px;	this is now set via PHP */
  width:180px;
  margin-left:10px;		/* to centre the element */
  padding: 0;
  z-index: 1;
}

IMG.icon {			/* Icons that go on iconbar */
  /* border: red solid 1px; */
  margin: 0px 4px 0px 4px;
  border: 0;			/* MSIE seems to need that */
}

SPAN.iconBar {			/* Icon bar that displays below cover image on bookshop/INDEX page */
  text-align:center;
  border:blue solid 1px;
  border-radius:8px;
  padding: 0;
  background-color:#000084;
  position:absolute;
  left:0px; bottom:20px;	/* relative to bottom of IMG.covers */
  width:200px;
  margin-left:0px;		/* to centre the element */
}

SPAN.iconBar2 {			/* as above but used for latest mods 07-nov-2019 */
  text-align:center;
  border:blue solid 1px;
  border-radius:8px;
  padding: 2px;
  background-color: #EEFFEE;
  position:absolute;
  left:0px; top:-30px;
  width:196px;
  margin-left:0px;
  font-size: smaller;
}

P.biblioIcons {			/* version of icon bar used elsewhere (auto width) */
  text-align:center;
  border:blue solid 1px;
  border-radius:8px;
  margin: 0;
  padding: 0;
  white-space: nowrap;		/* Dont want icons to wrap */
  background-color:#000084;
  width:auto;
}

TABLE.key {			/* pop-up key to icons on bookshop/INDEX page */
  color: white;
  vertical-align: middle;
  border:blue solid 1px;
  border-radius:8px;
  padding: 0;
  background-color:#000084;
  margin-bottom: 20px;
}

TABLE.titles {			/* presents icon bar and title on Wookey, Dales and biblio pages */
  vertical-align: middle;
  border: blue solid 1px;
  border-radius:8px;
  padding: 0;
  margin: 5px 0 10px 5px;
  background-color:#EEEEFF;
}

TABLE.titles TD {
  padding: 5px 10px 5px 10px;
}

TABLE.titles TD H2 {		/* This, like P.biblioIcons has no margins or padding. Use TABLE.titles TD */
  margin: 0;
  padding-right: 10px;
}

TABLE.titles TD H1 {		/* This, like P.biblioIcons has no margins or padding. Use TABLE.titles TD */
  margin: 0;
  padding-right: 10px;
}

DIV.titles {			/* based on TABLE.titles, for use on COVERs page for C&KS */
  vertical-align: middle;
  border: blue solid 1px;
  border-radius:8px;
  padding: 0;
  margin: 5px 0 10px 5px;
  background-color: white;
  padding: 5px 10px 5px 10px;
  float: right;
}

/* new styles for BIBLIO pages, meant to be better on phones. ===================================
   newBiblioIconTray replaces TABLE.titles, above.===============================================
   See notes in /pub/covers_README===============================================================
*/


/* ========== Icon tray, in dark blue with pale blue bacckground */

.newBiblioIconTray {
  vertical-align: middle;
  border: blue solid 1px;
  border-radius:8px;
  padding: 7px 15px 7px 12px;
  margin: 10px 0 10px 5px;
  background-color: #EEEEFF;
  display: inline-block; 
}

.newBiblioIconTray P { 
  display: inline-block; 
  margin-right: 22px;
}

.newBiblioIconTray H1,H2 { 
  display: inline-block; 
  margin: 8px 8px 0 0;
  vertical-align: top;
}

.nowrap {
  white-space: nowrap;
}