html {
    scroll-behavior: smooth;
  }
  
  body {
    /* font-family: 'Roboto', sans-serif; */
    font-family: "Montserrat", sans-serif;
    /*couleur secondaire #8d6d6d*/
    /* couleur primaire #6d8d8d*/
  }
  .lato{
    font-family: 'Lato', sans-serif;
  }
  .roboto{
    font-family: 'Roboto', sans-serif;
  }
  
  .divcentre {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
  }
  .center {
    position: absolute;
    left: 0%;
    top: 10%;
    transform: translate(-50%, -50%);
    /*border: 5px solid #FFFF00;*/
    padding: 10px;
  }
  
  p {
    font-family: "Montserrat", sans-serif;
  }
  
  /* Make the image fully responsive */
  .carousel-inner img {
    width: 400px;
    height: 200px;
  }
  /* couleurs brunes photos femme enceinte */
  /* brun mod: #a96e4b
  brun pale: #eaba9f
  brun fonce:#583723 */
  
  /* couleurs tons de bleux
  bgpale:#ccd9e2
  bgmod:#d67940
  bgfonce:#285185
  bgbrun:#6F4849 */
  
  /*    couleur site clinique Marconi
  
  bleu foncé : #0b5579 
  bleu moyen #159cdc
  bleu pale #89cae4
  gris fonce #727a82
  gris pale #acacb4
  
  /* bleu de la photo bebe piedsbleus
  pale : #a0d5e8
  fonce : #33a9d0
  gris fonce: #2c3850
  
  */
  
  .bgprimaire {
    background-color: #6d8d8d;
  }
  
  .bgpale {
    background-color: #a0d5e8;
  }
  .bgmod {
    background-color: #a0d5e8;
  }
  .bgfonce {
    background-color: #0b5579;
  }
  .bgblanc {
    background-color: #ffffff;
  }
  */ .bgblanc:hover {
    background-color: #88dbfc;
  }
  .bgbleu {
    background-color: #88dbfc;
  }
  .bgbleu:hover {
    background-color: white;
    border: 2px solid;
    border-color: #88dbfc;
  }
  .bgblancbleu {
    background-color: rgb(243, 243, 243);
  }
  .bgblancbleu:hover {
    background-color: #88dbfc;
    border: 1px solid black;
  }
  .bgred {
    background-color: red;
    opacity: 1;
  }
  
  .colorfonce {
    color: #285185;
  }
  .colormod {
    color: #df99cd;
  }
  .colorpale {
    color: #a0d5e8;
  }
  
  .bgmsd-bluepale {
    background-color: #a4cce4;
  }
  .bgmsd-bluemed {
    background-color: #349ccc;
  }
  .bgmsd-bluefonce {
    background-color: #306886;
  }
  .bgmsd-grispale {
    background-color: #9cacb4;
  }
  .bgmsd-grisfonce {
    background-color: #38444c;
  }
  
  .brunfonce {
    color: #615246;
  }
  
  .gris {
    color: gray;
  }
  
  .brunmed {
    color: #98806f;
  }
  
  .brunpale {
    color: #dcc3b2;
  }
  
  .bgbrun {
    background-color: #615246;
  }
  .bgpalebleu {
    background-color: #edf6fc;
  }
  
  .colorbrunhover:hover {
    color: black;
    /* color:#f6e9dc; */
  }
  
  .bgbrunhover:hover {
    background-color: #ca7f34;
    color: #eaba9f;
    font-size: larger;
  }
  
  .bgpale {
    background-color: #dcc3b2;
  }
  
  .bgbrunmed {
    background-color: #98806f;
  }
  
  .top-to-bottom {
    border-width: 0px 0px 0px 2px;
    border-style: solid;
    /* border-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)) 1 100%; */
  }
  
  .hoverimage {
    width: 200px;
    margin-top: 30px;
    transition: 0.4s ease;
  }
  
  .hoverimage:hover {
    margin: 15px 0px;
    border: 1px solid rgba(1, 39, 255, 0.3);
  }
  
  /*# sourceMappingURL=mystyles.css.map */
  
  .snap {
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    -ms-overflow-style: none;
    scroll-behavior: smooth
  }
  .snap::-webkit-scrollbar {
    display: none;
  }
  
  .snap > div {
    scroll-snap-align: center;
  }
  
  .carousel-open:checked+.carousel-item {
    position: static;
    opacity: 100;
  }
  
  .carousel-item {
    -webkit-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
  }
  
  #carousel-1:checked~.control-1,
  #carousel-2:checked~.control-2,
  #carousel-3:checked~.control-3 {
    display: block;
  }
  
  .carousel-indicators {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 2%;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10;
  }
  
  #carousel-1:checked~.control-1~.carousel-indicators li:nth-child(1) .carousel-bullet,
  #carousel-2:checked~.control-2~.carousel-indicators li:nth-child(2) .carousel-bullet,
  #carousel-3:checked~.control-3~.carousel-indicators li:nth-child(3) .carousel-bullet {
    color: #2b6cb0;
    /*Set to match the Tailwind colour you want the active one to be */
  }