

article {
  margin:2px 0px 5px 0px;
  padding:10px;
  background-color:#87CEFA;
  z-index:5; }

article.Scrolled dl { display:flex;
  justify-content: center;
  align-items: center; }

article.Scrolled dl.dtRight dt { order:2; margin: 0 1px 0 1px;}
article.Scrolled dl.dtRight dd { order:1; }
article.Scrolled dl.dtRight dt { flex:1 0 0; }
/* flex{ flex-grow flex-shrink flex-basis } */
article.Scrolled dl.dtRight.Ratio1x1 dd { flex:1 0 0; }
article.Scrolled dl.dtRight.Ratio1x2 dd { flex:2 0 0; }
article.Scrolled dl.dtRight.Ratio1x3 dd { flex:3 0 0; }

article.Scrolled dl.dtLeft dt { order:1; margin-right:5px;}
article.Scrolled dl.dtLeft dd { order:2; margin:0 5px 0 5px;}
article.Scrolled dl.dtLeft dt { flex: 1 0 0; }
article.Scrolled dl.dtLeft.Ratio1x1 dd { flex: 1 0 0; }
article.Scrolled dl.dtLeft.Ratio1x2 dd { flex: 2 0 0; }
article.Scrolled dl.dtLeft.Ratio1x3 dd { flex: 3 0 0; }
article.Scrolled dl.dtLeft.Ratio1x5 dd { flex: 5 0 0; }

article.Scrolled dl dt img {
  display:block; margin:auto;
  max-width:80%; }

/*----- 2 & 3 columns Thumbnails */
article.Scrolled dl dt {
  padding: 5px 0 5px 0;
  }
article.Scrolled dl dt.Thumbs1 {
  margin: 0% 0% 0% 0%;
  background-color: #ADD8E6; }
article.Scrolled dl dt.Thumbs1 img {
  padding: 5px 0 5px 0; }
article.Scrolled dl dt.Thumbs2 { display:grid;
  margin: 0% 0% 0% 0%;
  grid-template-columns: 1fr 1fr;
  background-color: #ADD8E6;
  grid-row-gap: 5px; }
article.Scrolled dl dt.Thumbs3 { display:grid;
  margin: 0% 0% 0% 0%;
  grid-template-columns: 1fr 1fr 1fr;
  background-color: #ADD8E6;
  grid-row-gap: 5px; }
article.Scrolled dl dt.Thumbs4 { display:grid;
  margin: 0% 0% 0% 0%;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  background-color: #ADD8E6;
  grid-row-gap: 5px; }

article div.Array { display: grid;
  background-color: #ADD8E6; }
article div.Array.Right { text-align: right; }
article div.Array p { padding: 0px 10px 0px 10px;
  border: solid #00BFFF }
article div.Array p.Left { text-align: left; }

/* Tableaux dans description */
article div.Array.Col2{ grid-template-columns: 1fr 1.5fr;
  margin: 0% 20% 0% 10%; }
article div.Array.Col341-5{ grid-template-columns: 3fr 4fr 1fr;
  margin: 0% 5% 0% 5%; }
article div.Array.Col4{ grid-template-columns: 3fr 1fr 1fr 1fr;
  margin: 0% 10% 0% 10%; }

/* Listes à puces dans description */
article section { margin: 10px 10px 10px 10px; }
article section ul { margin: 0px 0px 0px 10px;
  padding-left:5px; }
article section ul li { list-style-position: outside; }
article section ul.li10 li { margin-bottom: 10px; }
article section h2 { margin: 0px 0px 5px 0px; }





