.mh-two-sb .mh-container-outer {
  max-width: 100% !important;
}

.podcasts-container {
  width: 100%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  /* gap: 5%; */
}

.podcasts-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px;
  width: 24%;
  background: #FFFFFF;
  box-shadow: 7px 7px 29px rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  margin-bottom: 20px;

  /* Font  */
  font-family: 'Lato' !important;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
}

.podcasts-img {
  width: 100%;
  margin-bottom: 24px;
}

.podcasts-img img {
  width: 100%;
  border-radius: 16px !important;
}

.podcasts-main {
  width: 100%;
}

.podcasts-lecteur {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto 10px;
}

.podcasts-lecteur audio {
  width: 100%;
  margin-bottom: 20px;
}

.podcasts-waveform {
  width: 60%;
}

.podcasts-description {
  width: 100%;
  display: flex;
  align-items: center;
  color: #000000;
  margin: 20px 0;
}

.podcasts-details {
  width: 100%;
}

.podcasts-details span {
  font-weight: 700;
}

.podcasts-guests {
  display: flex;
  align-items: flex-start;
}

.podcasts-ligne {
  height: 1px;
  background-color: #EBEBEB;
  margin: 10px 0;
}

.podcasts-presentedby {
  display: flex;
  align-items: flex-end;
}

/* FILTRES */
#filtres-container {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 20px;
}

.filtres-int-cont {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}

.filtre-label {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-size: 18px;
  line-height: 24px;
  color: #000;
}

.filtre-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  width: fit-content;
  margin-bottom: 10px;
  height: 44px;
  border: 1px solid #979797;
  border-radius: 12px;
  cursor: pointer;
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  color: #979797;
}

.filtre-btn:hover {
  background-color: #F68E1E;
  border: none;
  color: #fff;
}

.active {
  background-color: #F68E1E;
  border: none;
  color: #fff;
}

/* EMISSIONS */
.emissions-container {
  width: 100%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.emissions-card {
  width: 49%;
  margin-bottom: 20px;
  display: flex;
}

.emissions-img {
  width: 60%;
  height: 100%;
}

.emissions-img img {
  /* width: 250px; */
  height: 100% !important;
  object-fit: cover;
  border-radius: 16px 0 0 16px !important;
}

.emissions-right {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 16px;
  background: #FFFFFF;
  box-shadow: 7px 7px 29px rgba(0, 0, 0, 0.05);
  border-radius: 0px 16px 16px 0px;
}

.emissions-details {
  display: flex;
  flex-direction: column;
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  margin-bottom: 20px;
}

.emissions-name {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  width: 100%;
  margin-bottom: 10px;
}

.emissions-time {
  font-size: 14px;
  line-height: 20px;
  color: #79747E;
  display: flex;
  align-items: center;
}

.emissions-point {
  font-size: 0.6rem;
  margin: 0 10px;
}

.emissions-ligne {
  height: 1px;
  background-color: #EBEBEB;
  margin: 10px 0;
}

.emissions-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  gap: 2px;
  width: 70%;
  min-height: 44px;
  background: #F68E1E;
  border-radius: 50px;
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: #FFFFFF;
  margin: 0 auto;
  cursor: pointer;
}

.emissions-details {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: #000000;
}

.emissions-details span {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-size: 18px;
  line-height: 24px;
}


/* AUDIO PLAYER  */

.page-player {
  z-index: 9999;
  width: 100%;
  height: 90px;
  background: #2a2a2a;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  position: sticky;
  bottom: 0;
  left: 0;
  padding: 0px;
  box-sizing: border-box;
  color: #fff;
}

.page-incont {
  width: 60%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.player-img {
  width: 50px;
}

.player-name,
.player-live-name {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
}

.page-player input[type=range] {
  /* Enlever l'aspect par défaut du navigateur */
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 8px;
  padding: 0;
  background: #e0e0e0;
  outline: none;
  /* Ajouter l'effet hover */
  transition: .2s;
}

.page-player input[type=range]:hover {
  background: #cfcece;
}

.page-player input[type=range]::-webkit-slider-thumb {
  /* Webkit */
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  background: #4CAF50;
  cursor: pointer;
  border-radius: 50%;
}

.page-player input[type=range]::-moz-range-thumb {
  /* Firefox */
  width: 14px;
  height: 14px;
  background: #ff6d00;
  cursor: pointer;
  border-radius: 50%;
}

.play,
.pause {
  cursor: pointer;
  width: 40px;
  height: 40px;
}

.play {
  background: url("https://infodiag.fr/wp-content/uploads/2023/05/play-white.png");
  background-size: contain;
  background-repeat: no-repeat;
}

.pause {
  background: url("https://infodiag.fr/wp-content/uploads/2023/05/pause.png");
  background-size: contain;
  background-repeat: no-repeat;
}

.progress-container {
  width: 100%;
  height: 10px;
  background-color: #e0e0e0;
  position: relative;
  cursor: pointer;
  margin-bottom: 15px;
}

.progress {
  width: 0%;
  height: 10px;
  background-color: #ff6d00;
  position: absolute;
  left: 0;
}

.time-display {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
}

.webpushr-toggle-bell-popup ._Bell .Bottom .Left_bell {
  display: none!important;
}

/* PAGINATION  */
.emissions-pagination {
  height: 112px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagi-number {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0px;
  gap: 24px;
  width: fit-content;
  height: 28px;
}

.pagi-number div {
  font-family: 'Poppins'!important;
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 24px;
  color: #2A2A2A;
  cursor: pointer;
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagi-number div:hover {
  background: rgba(167, 167, 167, 0.2);
  border-radius: 12px;
  font-weight: 600;
  color: #F68E1E;
}

.pagi-number-active {
  background: rgba(167, 167, 167, 0.2);
  border-radius: 12px;
  font-weight: 600!important;
  color: #F68E1E!important;
}

/* WAVE  */
.container-wave {
  position: relative;
  transition: opacity 0.5s ease-out, max-height 0.5s ease-out;
  opacity: 0;
}

.visible {
  opacity: 1;
}

.container-wave span {
  display: block;
  bottom: 0px;
  width: 2px;
  height: 10px;
  background: #ff6d00;
  position: absolute;
  animation: audio-wave 2s infinite ease-in-out;
}

.container-wave span:nth-child(1) {
  left: 6px;
  animation-delay: 0.3s;
}

.container-wave span:nth-child(2) {
  left: 12px;
  animation-delay: 0.6s;
}

.container-wave span:nth-child(3) {
  left: 18px;
  animation-delay: 0.9s;
}

.container-wave span:nth-child(4) {
  left: 24px;
  animation-delay: 1.2s;
}

.container-wave span:nth-child(5) {
  left: 30px;
  animation-delay: 1.5s;
}

.container-wave span:nth-child(6) {
  left: 36px;
  animation-delay: 1.8s;
}

.container-wave span:nth-child(7) {
  left: 42px;
  animation-delay: 2.1s;
}

.container-wave span:nth-child(8) {
  left: 48px;
  animation-delay: 2.4s;
}

.container-wave span:nth-child(9) {
  left: 54px;
  animation-delay: 2.7s;
}

.container-wave span:nth-child(10) {
  left: 60px;
  animation-delay: 3s;
}

.container-wave span:nth-child(11) {
  left: 66px;
  animation-delay: 3.3s;
}

.container-wave span:nth-child(12) {
  left: 72px;
  animation-delay: 3.6s;
}

.container-wave span:nth-child(13) {
  left: 78px;
  animation-delay: 3.9s;
}

.container-wave span:nth-child(14) {
  left: 84px;
  animation-delay: 4.2s;
}

.container-wave span:nth-child(15) {
  left: 90px;
  animation-delay: 4.5s;
}

@-moz-keyframes audio-wave {
  0% {
    height: 15px;
    transform: translateY(0px);
  }

  25% {
    height: 60px;
    transform: translateY(20px);
  }

  50% {
    height: 15px;
    transform: translateY(0px);
  }

  100% {
    height: 10px;
    transform: translateY(0px);
  }
}

@-webkit-keyframes audio-wave {
  0% {
    height: 15px;
    transform: translateY(0px);
  }

  25% {
    height: 60px;
    transform: translateY(20px);
  }

  50% {
    height: 15px;
    transform: translateY(0px);
  }

  100% {
    height: 10px;
    transform: translateY(0px);
  }
}

@-o-keyframes audio-wave {
  0% {
    height: 15px;
    transform: translateY(0px);
  }

  25% {
    height: 60px;
    transform: translateY(20px);
  }

  50% {
    height: 15px;
    transform: translateY(0px);
  }

  100% {
    height: 10px;
    transform: translateY(0px);
  }
}

@keyframes audio-wave {
  0% {
    height: 15px;
    transform: translateY(0px);
  }

  25% {
    height: 60px;
    transform: translateY(20px);
  }

  50% {
    height: 15px;
    transform: translateY(0px);
  }

  100% {
    height: 10px;
    transform: translateY(0px);
  }
}

@media screen and (max-width: 1510px) {
  .page-incont {
    width: 80%;
  }
}

@media screen and (max-width: 1320px) {
  .emissions-button {
    width: 90%;
  }
  .filtres-int-cont {
    width: 60%;
  }
}

@media screen and (max-width: 1170px) { 
  .filtres-int-cont {
    width: 70%;
  }
}

@media screen and (max-width: 1070px) {
  .emissions-button {
    width: 100%;
  }
  .filtres-int-cont {
    width: 75%;
  }
  #webpushr-bell-optin {
    display: none;
  }
}

@media screen and (max-width: 1095px) {
  .page-incont {
    width: 80%;
  }

  .player-name {
    display: none;
  }

  .filtres-int-cont {
    width: 80%;
    gap: 1%;
  }
}

@media screen and (max-width: 1070px) {
  .emissions-button {
    width: 100%;
  }
}

@media screen and (max-width: 900px) {
  .filtres-int-cont {
    width: 90%;
  }
}



@media screen and (max-width: 768px) {
  .podcasts-card {
    width: 49%;
  }

  .emissions-card {
    width: 100%;
  }

  .filtres-int-cont {
    width: 100%;
  }
  .filtre-label {
    margin-bottom: 20px;
  }
  .filtre-btn {
    width: 49%;
    height: fit-content;
  }

}

@media screen and (max-width: 450px) {
  .volume-cont {
    display: none;
  }
}

@media screen and (max-width: 360px) {
  .podcasts-card {
    width: 100%;
  }

  .emissions-card {
    flex-direction: column;
  }

  .emissions-img {
    width: 100%;
  }

  .emissions-img img {
    border-radius: 18px 18px 0 0 !important;
  }

  .emissions-description {
    margin-bottom: 20px;
  }

  .audio-player {
    flex-direction: row;
  }
}