
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

.arima {
  font-family: "Arima", system-ui;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}


body{
  background-color: #fff;
  font-family: arial, sans-serif;
  color:white;
  margin: 0; padding: 0; position: relative; 
  overflow:hidden;
  /* cursor: url(../cursor/cursor-main-deplacer.png), default; */
}

a.lien-vide { text-decoration: none; border:none; padding:0px; margin:0; background:transparent; color:black; }
a.lien-vide:hover { text-decoration: none; background:transparent; }

/* .move  { cursor: url(../cursor/cursor-main-cliquer.png), default; } */

.d-none { display:none !important; }
.d-block { display:block; }

.invisible { visibility: hidden; }

/* - - - - SCENE */
#scene-wrapper {
  position: relative;
  display: flex; justify-content: center; align-items: center;
  height: 100vh; 
  background-color: #111; 
}

#scene {
  
  position: relative;

  width: 100%; max-width: 1920px;
  aspect-ratio: 16 / 9;
  max-height: 1080px;
  background-color: #fff6e0;

  overflow: hidden;

  /* perspective: 1200px; */
  /* cursor: url(../cursor/cursor-main-deplacer.png), default; */

}

.maquette {
  position: absolute; top:0; left:0; z-index:10;
  height: 100%;    
  display: flex; align-items: center; justify-content: center;
  transition: 0.25s ease;
  opacity: .5;
}
.maquette img { height: 100%; width: auto; display: block; }

#app {
  position: absolute;
  width: 100%; max-width: 1920px;
  aspect-ratio: 16 / 9;
  height:100%; max-height: 1080px;
  background-color: #fff6e0;
  overflow: hidden;
}

#kazApp-content {
  width: 100%;
  height: 100%;
  background: rgb(255, 204, 0, .5);
  position: absolute;
  z-index: 99;
  display: flex;
  justify-content: center;
  align-items: center;
  font: bold 30px Arial;
}

.ligne-horizontale {
  position: absolute; top: 50%; left: 0%; z-index: 1;
  width: 100%; height: 1px; background-color: #f00;
  transform: translate(0%) translateY(-50%);
}
.ligne-verticale {
  position: absolute; top: 0%; left: 50%; z-index: 1;
  width: 1px; height: 100%; background-color: #f00;
  transform: translate(-50%) translateY(0%);
}

.page-wrapper {
  position: relative;
  width:100%; height:100%;
}

/*
.page_container {
  position: absolute; top: 50%; left: 50%;
  width: 30%; height: auto;
  text-align: center;
  transform: translate(-50%) translateY(-50%);
}
.page_container img { width:100%; height:auto; }

.page_gauche_A {
  position: absolute; top: 50%; left: 34%;
}

.page_droite_B {
  position: absolute; top: 50%; left: 64%;
}

.flottant {
  transform-origin: center center; 
  animation: flotter 3s ease-in-out infinite alternate;
}

@keyframes flotter {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-10px);
  }
}
*/