/*  COLOR:
    JAUNE   pale    ffffcc  rgba(255, 255, 204, 1.0)
    JAUNE   clair   f9d66c  rgba(249, 214, 108, 1.0)
    JAUNE   base    f8ba57  rgba(248, 186, 87, 1.0)
    ORANGE  claire  e6854d  rgba(230, 133, 77, 1.0)
    ORANGE          e06d29  rgba(224, 109, 41, 1.0)
    MARRON  défault 4d2111  rgba(77, 33, 17, 1.0)
    MARRON  sombre  290000  rgba(41, 0, 0, 1.0)
    MARRON  claire  964f3d  rgba(150, 79, 61, 1.0)
    MARRON  texte   4d2110  rgba(77, 33, 16, 1.0)



    NEW
    MARRON  FADE    #7b594d  rgba(123, 89, 77, 1.0)
    MARRON  BCKG    #4d2111  rgba(77, 33, 17, 1.0)
    MARRON  2DE     #3f1b0d  rgba(63, 27, 13, 1.0)
    JAUNE   PALE    #ffffcc  rgba(255, 255, 204, 1.0)
    JAUNE   BASE    #f8ba57  rgba(248, 186, 87, 1.0)
    JAUNE   2DE     #f5a623  rgba(245, 166, 35, 1.0)

*/

.main-title{
    font-size: 2.2rem;
    color: rgba(248, 186, 87, 1.0);
    text-shadow: 0px 0px 35px rgba(230, 111, 32, 0.7);
    letter-spacing: 2px;
    text-align: center;
}

.bg-motif{
    background: repeating-linear-gradient( 45deg,#0000 calc(-650%/13) calc(50%/13),rgba(230, 111, 32, 0.08) 0 calc(100%/13), #0000 0 calc(150%/13),rgba(230, 111, 32, 0.08) 0 calc(200%/13), #0000 0 calc(250%/13),rgba(230, 111, 32, 0.08) 0 calc(300%/13)), repeating-linear-gradient( 45deg,#0000 calc(-650%/13) calc(50%/13),rgba(230, 111, 32, 0.08) 0 calc(100%/13), #0000 0 calc(150%/13),rgba(230, 111, 32, 0.08) 0 calc(200%/13), #0000 0 calc(250%/13),rgba(230, 111, 32, 0.08) 0 calc(300%/13)) 100px 100px, repeating-linear-gradient(-45deg,#0000 calc(-650%/13) calc(50%/13),rgba(230, 111, 32, 0.08) 0 calc(100%/13), #0000 0 calc(150%/13),rgba(230, 111, 32, 0.08) 0 calc(200%/13), #0000 0 calc(250%/13),rgba(230, 111, 32, 0.08) 0 calc(300%/13)), repeating-linear-gradient(-45deg,#0000 calc(-650%/13) calc(50%/13),rgba(230, 111, 32, 0.08) 0 calc(100%/13), #0000 0 calc(150%/13),rgba(230, 111, 32, 0.08) 0 calc(200%/13), #0000 0 calc(250%/13),rgba(230, 111, 32, 0.08) 0 calc(300%/13)) 100px 100px rgba(245, 170, 101, 0.0);
    background-size: 100% 50%;
}

/* CARTOUCHE  */
.content-cartouche {
    margin: 0em auto;
    max-width: 48em;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;

}
.item-cartouche {
    overflow: hidden;
    margin: 3em auto;
    max-width: 16em;
    min-width: 15em;

    color: #290000;
    background-color: #ffffcc;
    border: 2px groove #964f3d;
    border-radius: 20px;
    align-items: center;
}
.item-cartouche h2 {
    padding: 0em;
    color: #e06d29;
    text-align: center;

}
.item-cartouche p {
    padding: 1em 1em;
    font-size: 14px;
    color: #4d2111;
    text-align: center;
    font-weight: bolder;
    font-family: system-ui, Arial, sans-serif;
}

a.link-cartouche{
    font-size: 14px;
    color: #e06d29;
    font-weight: bolder;
    font-family: system-ui, Arial, sans-serif;
}



#on-the-roof {
  position: fixed;
  bottom: -10px;
  right: 15px;

  margin-right: auto;
  margin-left: auto;
  z-index: 99;
  border: none;
  outline: none;
  
  width: 50px; 
  height: 50px; 
  border-radius: 50%;

  background-color: #e06d29;
  color: #4d2111;

  cursor: pointer;
  font-size: 0.9em;
  font-weight: bolder;
  opacity: 0;
}

#on-the-roof:hover {
  color: rgba(224, 109, 41, 1);
  background-color: #4d2111;
  opacity: 0.6;
}