/** END FONCTIONS **/
#entete .fond {
  background-color: #01aad7;
  height: 400px;
  background-image: url(../images/nuage-page-entete.png), url(../images/fond-page-entete.jpg);
  background-size: 337px, 1024px;
  background-position: center 10px, center;
  background-repeat: no-repeat;
  overflow: hidden;
  position: relative;
}
#entete .fond.perso {
  background-size: 1024px;
  background-position: center;
}
#entete .fond:after {
  content: '';
  width: 100%;
  height: 150px;
  background-image: url(../images/vague-page-entete.png);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 1024px;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
}
#entete .conteneur {
  height: 100%;
}
#entete .logo {
  position: absolute;
  top: 100px;
  right: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto;
}
#entete .stella {
  position: absolute;
  bottom: -10px;
  left: -50px;
}
#entete .machine {
  position: absolute;
  bottom: 0;
  right: -40px;
}
#page_interne {
  margin-top: 50px;
}
span.mec-agenda-event-title {
  display: block;
}
@media (min-width: 1024px) {
  .conteneur {
    width: calc(100% - 40px);
  }
  .row {
    display: flex;
    justify-content: space-between;
  }
  .row.align-items-center {
    align-items: center;
  }
  .row .col {
    width: calc(50% - 60px);
  }
  #entete {
    position: relative;
  }
  #entete .fond {
    height: 660px;
    background-size: 674px, 2048px;
    overflow: visible;
  }
  #entete .fond.perso {
    background-size: 1920px;
  }
  #entete .fond:after {
    background-size: 1920px;
    background-position: center bottom;
  }
  #entete .logo {
    width: 246px !important;
    top: 190px;
  }
  #entete .machine {
    right: 50%;
    transform: translateX(955px);
  }
  #entete .stella {
    left: 50%;
    transform: translateX(-955px);
    bottom: 30px;
  }
  #entete .fleur {
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-560px);
    z-index: 10;
  }
  #entete .nuage1 {
    position: absolute;
    top: 0;
    left: -330px;
    animation: nuage1 7s ease-in-out infinite;
  }
  @keyframes nuage1 {
    0%,
    100% {
      transform: translateX(-70px);
    }
    50% {
      transform: translateX(30px);
    }
  }
  #entete .nuage4 {
    position: absolute;
    top: 370px;
    right: 100px;
    animation: nuage4 6s ease-in-out infinite;
  }
  @keyframes nuage4 {
    0%,
    100% {
      transform: translateX(50px);
    }
    50% {
      transform: translateX(-50px);
    }
  }
}