/***** home.css *****/
.containerWholeHome {
  margin: auto;
  width: 750px;
  overflow: auto;
  //border: solid 1px grey;
}
.containerHome {
  margin: auto;
  width: 100%;
  overflow: auto;
  //border: solid 1px orange;
}
/**************************/
/* slide Box  */
.containerBoxes {
  margin: auto;
  width:100%; 
  overflow: hidden;
  padding-top:10px;
  //border: 1px solid black;
}
:root {
  --eachbox:250px;
}
/******* No table *******/
.divBoxes {
  display: block;
  float: left; 
  margin:auto;
  width:var(--eachbox);
  overflow: visible;
}
.divBoxA {
  float: left; 
  //border: solid 1px lime;
}
.divBoxB {
  float: left; 
  //border: solid 1px black;
}
.divBoxC {
  float: right; 
  //border: solid 1px magenta;
}
/******** Box Spc ********/
/* Number order is col by col: Top to Bottom */
.divBoxSpc {
  display:block;
  margin: auto;
  width:var(--eachbox);
  overflow: visible;
  //border: 1px solid aqua;
}
.dbs1 {
  height:50px;
}
.dbs2 {
  height:80px;
}
.dbs3 {
  height:105px;
}
.dbs4 {
  height:65px;
}
.dbs5 {
  height:1px;
}
.dbs6 {
  height:55px;
}
/******** Box Img ********/
/* shadow h-offset (neg=right) v-offset (neg=top) blur */
/* color is defined by root in main.css */
.divBoxImg {
  display:block;
  margin: auto;
  overflow: visible;
  //border: 1px solid red;
}
.dbi1 {
  box-shadow: 4px 3px 6px var(--greylighter); 
}
.dbi2 {
  box-shadow: 4px 3px 6px var(--gold); 
}
.dbi3 {
  box-shadow: 4px 3px 6px var(--grey);
}
.dbi4 {
  box-shadow: 4px 3px 6px var(--greylighter);
}
.dbi5 {
  box-shadow: 4px 3px 6px var(--greylight); 
}
.dbi6 {
  box-shadow: 4px 3px 6px var(--grey);
}
/********  Cap ********/
.divBoxCap {
  display:block;
  width:var(--eachbox);
  height:25px; 
  margin:auto;
  overflow: visible;
  padding-top:8px;
  //border: 1px solid green;
}
.paraCap {
  text-align:center;
  font-family: "Helvetica", "Trebuchet MS", "sans-serif";
  font-size:0.8em;
  font-style:oblique;
  color: #000;
  //border: 1px solid yellow;
}
.capShow {
  opacity:1;
  transition:opacity 500ms;
}
.capHide {
  opacity:0;
}
.capBlankNone {
  display:none;
}
.capBlankDisplay {
  display:block;
}
/* image */
.imgShow {
  margin:auto;
  display:block;
  opacity:1;
  transition:opacity 500ms;
}
.imgHide {
  margin:auto;
  display:block;
  opacity:0;
}
.imgBlankNone {
  display:none;
}
.imgBlankDisplay {
  display:block;
}
/***** end *****/
