body{
  padding: 0;
  margin: 0;

  background-color: red;
}

.img_bkgd{
  position: absolute;
  z-index: 1;
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.totem-ext .img_bkgd{
  position: absolute;
  
  width: 128px;
  height: 64px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

#img_galop{
  background-image: url('../img/galop.png');
  z-index: 2;
}

#img_trot{
  background-image: url('../img/trot.png');
  z-index: 1;
}

ul{
  margin: 0;
  padding: 0;
}

li{
  list-style: none;
}

section{
}

div{
  display: inline-block;
  margin: 0;
  padding: 0;
}

.espace{
  display: inline-block;
  width: 3vw;
  margin: 0;
  padding: 0;
}

.small{
  font-size: 7vh;
  margin: 0;
  padding: 0;
}

.salle{
  background-color: white;
}

.simple{
  background-color: black;
}

.allege{
  background-color: black;
}

.lotEncheres{
  background-color: black;
}

.video{
  background-color: white;
}

.fadeOut{
  display: block;
  visibility: hidden;
  opacity: 0;

  transition: visibility 300ms, opacity 300ms;
}

.fadeIn{
  display: block;
  visibility: visible;
  opacity: 1;

  transition: visibility 300ms, opacity 300ms;
}

.bordeaux{
  color: #862041;
}

.none{
  display: none;
}

.hide{
  visibility: hidden;
}

.spacing_normal{
  letter-spacing: normal;
  word-spacing: normal;
}

.right{
  text-align: right;
}

/* Décoration du status */
#status{
  position: absolute;
  margin: 1% 1% 0 99%;
  top: 0;
  left: 0;
  z-index: 10;
  width: 0.28%;
  height: 0.5%;
}

.erreur{
  background-color: red;
}

.attente{
  background-color: yellow;
}
.presence{
  background-color: lightgrey;
}

/*disparition du curseur en plein écran*/
.no_cursor{
  cursor: none;
}

.fit {
  display: inline-block;
  white-space: nowrap;
}

.trop_long{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/*span.capt:first-letter{

}
*/
#contenu{
  position: absolute;
  top: 2.5vh;
  left: 2.5vw;

  width: 95vw;
  height: 95vh;

  margin: 0;
  padding: 0;

  z-index: 100;
}

#contenu.vincennes{
  width: 93vw;
  height: 95vh;
  padding: 0vh 1vw;
}

.totem-ext #contenu{
  top: 0;
  left: 0;

  width: 128px;
  height: 64px;
}

.allege #contenu{
  top: 3.5vh;
  left: 3.5vw;

  width: 93vw;
  height: 93vh;
}

.video #contenu{
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}

#lot_prix{
  display: inline-block;
  position: relative;
  width: 93vw;
}

.salle #lot_prix{
  width: 95vw;
}

.salle .vincennes #lot_prix{
  width: 93vw;
}

#lot{
  position: relative;
  float: left;
  text-align: left;
  /*background-color: green;*/
}

#prix{
  position: relative;
  float: right;
  text-align: right;
  /*background-color: blue;*/
}

.totem-ext #lot{
  display: block;
  float: none;
  text-align: center;
}

/*
Ring
*/
.ring #lot{
  display: block;
  float: none;
  text-align: center;
  margin: 10vh 0 0 0;
}

.ring #prix{
  display: block;
  float: none;
  text-align: center;
  margin: 10vh 0 0 0;
}
/*fin Ring*/

#details{
  display: inline-block;
  position: relative;
}

.salle #detail li{
  width: 55vw;
}

.simple #detail{
  display: block;
}

.simple #detail li{
  width: 50vw;
}

.allege #detail{
  display: block;
}

.allege #detail li{
  width: 45vw;
}

/*______________________________________________________________*/

#pedigre{
  display: flex;
  height: 15vh;
}

#pedigre > div{
  display: inline-block;
  margin: auto 0;
}

.simple #pedigre .categorie{
  margin: 1vh 0 1vh 0;
  height: 8vh;
}

#pedigre span{
  display: inline-block;
  /*text-transform: capitalize;*/
  margin: 0;
  padding: 0;
}

#pedigre span::first-letter {
  text-transform: capitalize;
}

#nom{
  display: flex;
  font-weight: bold;
  height: 15vh;
}

#nom > div{
  margin: auto 0;
}

#nom > div > div{
  display: inline-block;

  height: 7vh;
}

#nom span{
  display: inline-block;
  text-transform: capitalize;
  line-height: 7vh;
  margin: 0;
  padding: 0;
}

#vendeur{
  position: absolute;
  top:32vh;

  height: 8vh;
}

#update{
  position: absolute;
  top: 41vh;

  display: inline-flex;

  width: 60vw;
  /*height: 12vh;*/
  height: 14vh;
}

#update > div{
  margin: auto 0;
}

/*.update*/

#devises{
  position: absolute;
  top: 0vh;
}

.salle #devises{
  left: 55vw;
  width: 40vw;
}

.salle .vincennes #devises{
  left: 53vw;
}

.trot .salle #devises div {
    display: block;
}

.simple #devises{
  top: 0;
  left: 42vw;
  width: 53vw;
}

#devises > div{
   float: right;
}

#devises ul{
  display: inline-block;
}

#devises ul li{
  margin-bottom: 1vh;
}

#montants_liste{
  text-align: right;
}

.salle #montants_liste{
  margin-left: 1vw;  
}

.simple #montants_liste{
  margin-left: 2vw;
}

.allege #montants_liste{
  margin-left: 2vw;
}

.precedent{
  position: absolute;
}

.salle .precedent{
  top: 63vh;
  left: 55vw;
  width: 40vw;
}

.salle #precedent_attente{
  top: 88vh;
  margin-left: auto;
}

/*.trot .salle #precedent{
  margin-top: 2vh;
}*/

.simple .precedent{
  top: 64vh;
  left: 40vw;
  width: 55vw;
}

.salle .vincennes .precedent{
  left: 53vw;
}

.precedent > div{
   float: right;
}

.precedent ul{
  display: inline-block;
}

#devises ul li{
  margin-bottom: 1vh;
}

.precedent_montants_liste{
  text-align: right;
}

.salle .precedent_montants_liste{
  margin-left: 2.5vw;
}

.simple .precedent_montants_liste{
  margin-left: 2.5vw;
}

.allege .precedent_montants_liste{
  margin-left: 2.5vw;
}



#dev{
  position:absolute; 
  bottom: 0;
}

#dev input{
  text-align: center;
  font-size: 0.5em;
  /* color: white; */
  border-color: white;
  border-style: solid;
  border-width: 0.05em;
  border-radius: 0.5em;
}

#dev input:active{
  border-top: solid 0.1em red;
}

.identificateur{
  position: absolute;
  left: 5vw;
  top: 2vh;
  font-size: 4vh;
  font-weight: bold;
  color: lightgrey;
  z-index: 3;
  text-transform: capitalize;
}

.vente_active.identificateur{
  display: none;
}

.totem-ext .identificateur{
  font-size: 0.8vh;
  top: 0.5vw;
  left: 0.5vw;
}