@charset "UTF-8";
:root {
  --couleurFond: #dfe6e9;
  --couleurWrapper: #a29bfe;
  --couleurAccentWrapper: #6c5ce7;
  --couleurLiens:#6c5ce7;
  --couleurJauge:#6c5ce7;
  --couleurTexte:#000000; }

body {
  font: 1em 'Fira Sans', sans-serif;
  font-variant: common-ligatures;
  background: var(--couleurFond);
  padding: 0;
  color: var(--couleurTexte); }

.wrapper {
  width: 98%;
  display: inline-block;
  color: var(--couleurTexte); }

.cssImage {
  display: none; }

.bande {
  position: relative;
  border: 8px solid var(--couleurFond);
  width: 100%;
  height: 12vh;
  background-color: var(--couleurWrapper);
  overflow: hidden;
  transition: all 1s; }

.categorie {
  padding-right: 2pt;
  padding-left: 2pt;
  position: relative;
  border: 8px solid var(--couleurFond);
  width: 100%;
  max-height: 12vh;
  background-color: var(--couleurWrapper);
  overflow: hidden;
  transition: max-height 1s ease-out; }

.abstract {
  width: min(90%, 800px);
  margin: auto;
  margin-top: 10px;
  border: 3px solid var(--couleurWrapper);
  text-align: center;
  padding: 5px;
  background-color: var(--couleurFond); }

.developpee {
  max-height: 3000px;
  transition: max-height 1s ease-in; }

.photodeveloppee .photo img {
  transform: translateY(0%); }

.photo img {
  width: 100%;
  transform: translateY(-45%);
  transition: all 1s; }

.nom {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  display: inline-block;
  font-size: 5vh; }

.nomFamille {
  font-variant: small-caps;
  font-size: 110%; }

.boitebouton {
  position: relative;
  width: 24%;
  display: inline-block;
  padding-top: 12.5%;
  white-space: nowrap; }

.bouton {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  white-space: nowrap; }

.postal {
  display: inline-block; }

.actif {
  background-color: var(--couleurAccentWrapper);
  font-size: 5vh; }

.contactPhone {
  text-align: center;
  vertical-align: middle; }

.contactPhone a {
  text-decoration: none; }

/* dessin contact */
/* Hand made (et même hand drawn) !! */
.tete {
  position: absolute;
  left: 15%;
  top: 6%;
  width: 20%;
  height: 40%;
  border-radius: 50%;
  background-color: var(--couleurWrapper); }

.buste {
  position: absolute;
  left: 5%;
  top: 50%;
  width: 40%;
  height: 40%;
  border-radius: 30% 30% 0 0;
  background-color: var(--couleurWrapper); }

.ligne {
  position: absolute;
  right: 10%;
  top: 20%;
  width: 20%;
  height: 7%;
  background-color: var(--couleurWrapper);
  transition: 1s; }

#vertical {
  transform: rotate(90deg); }

.indic {
  display: none; }

a {
  color: var(--couleurLiens);
  text-decoration: none; }

.normal a {
  color: inherit; }

/* jauge */
.aiguille {
  /** pour que le svg s'adapte à la taille de son contenant */
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  /* **/
  stroke: var(--couleurFond);
  stroke-width: 8px;
  stroke-linejoin: round;
  fill: var(--couleurAccentWrapper); }

.aiguilleContainer {
  position: absolute;
  bottom: 40px;
  width: 60px;
  height: 20px;
  transition: all 2s;
  transform-origin: 50px 10px;
  overflow: visible;
  z-index: 8; }

.jauge {
  display: inline-block;
  margin: 10px;
  width: 100px;
  height: 100px;
  background-color: var(--couleurWrapper);
  position: relative; }

.fondjauge {
  position: absolute;
  width: 100px;
  height: 50px;
  top: 0px;
  border-radius: 50px 50px 0 0;
  background-color: var(--couleurFond);
  z-index: 1;
  overflow: hidden; }

.devantjauge {
  font-size: 1em;
  text-salign: center;
  position: absolute;
  width: 70px;
  height: 35px;
  top: 15px;
  left: 15px;
  border-radius: 50px 50px 0 0;
  background-color: var(--couleurWrapper);
  z-index: 3; }

.labeljauge {
  position: absolute;
  height: 40px;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 14px;
  z-index: 8; }

.labeljauge img {
  display: inline-block;
  max-width: 70px;
  max-height: 100%;
  width: auto;
  height: auto; }

.indicateurjauge {
  position: absolute;
  z-index: 2;
  top: 100%;
  width: 100%;
  height: 100%;
  border-radius: 0 0 50px 50px;
  background-color: var(--couleurJauge);
  transform-origin: center top;
  transition: 1s; }

/* comp */
.ensembleComp {
  border: 3px solid var(--couleurFond);
  text-align: center;
  position: relative;
  margin-left: 15px;
  margin-right: 5px;
  margin-bottom: 5px;
  border-radius: 0.5em;
  min-height: 100px;
  vertical-align: middle;
  padding-left: 15px; }

.eckey {
  position: absolute;
  padding: 2px;
  top: 50%;
  left: 0px;
  transform: translate(-50%, -50%) rotate(-90deg);
  border: 3px solid var(--couleurFond);
  background-color: var(--couleurWrapper); }

.ectitre {
  font-weight: bold; }

.tdtexte {
  width: calc(100% - 64px); }

.tdicone {
  width: 64px; }

.icone {
  width: 57.6px; }

/* titres catégories */
.ctcontainer {
  text-align: center;
  min-height: 12vh;
  transition: min-height 1s;
  position: relative; }

.reduit {
  min-height: 0px; }

.reduit .triangle {
  transform: rotate(60deg); }

.catetitre {
  display: inline-block; }

.triangle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 15px;
  border-top: 20px solid var(--couleurAccentWrapper);
  border-right: 11.54px solid transparent;
  border-left: 11.54px solid transparent;
  transition: all 1s; }

/* pub */
.pub {
  display: none; }

/* etoiles */
.etoiles {
  scale: 2;
  color: #636e72; }

.positives {
  color: #fdcb6e; }

.coordicon {
  max-height: 25pt;
  display: inline-block;
  vertical-align: top;
  transform: translateY(4pt); }

/*# sourceMappingURL=petit.css.map */