
#podcast-container h1 {
    font-size:2.2em;
}

#podcast-container h2 {
    font-size:1.8em;
    font-family: Georgia,'Times new roman',serif;
}

  /*====================================
  PODCAST
  ======================================*/
  .podcast-container {
    border:1px solid #cccccc;
    padding:20px;
    max-width:700px;
    margin-bottom: 20px;
    
  }



  .podcast-title {
    font-family: Georgia,'Times new roman',serif;
    font-size:1.5em;
    padding-bottom: 0px;
    line-height: 1.5em;
    padding-left:10px;
    padding-top:10px;
    color: #00abd6;
    font-size:1.6em;
    
  }
 

  .podcast-title a {
    text-decoration: none;
  }

  .podcast-content {
    color: #666666;
  }

  .podcast-read-button {
    float:right;
    right:10px;
  }


.podcast-main-grouptitle {
    padding-bottom:20px;
    padding-top:10px;
}
.podcast-main-title {
    font-size: 2.2em;
    line-height: 1.35em;
    color: #173a49;
    
}

.podcast-main-title2 {
    font-size: 2.2em;
    line-height: 1.35em;
    color: #999;
    
}

.podcast-main-subtitle {
    font-size: 1.4em;
    color: #aaa;
    
}

.podcast-intro {

  margin-top:0px;
  margin-bottom: 20px;
  padding:20px 30px 20px 30px;
  font-family: Georgia, 'Times New Roman', Times, serif; 
  font-size: 1.15em; 
  color:#666666;
  background-color:#f5f5f5;
  border-radius: 4px;

}

.podcast-authors {
  padding-left:20px;
  padding-top:10px;
  color:#000;
}

.podcast-short-description-box {
  float:right; 
  margin-top:0px;
  margin-bottom: 0px;
  padding:20px 30px 0px 20px;
  /*font-family: Georgia, 'Times New Roman', Times, serif; */
  /*font-size: 1.15em; */
  color:#444;
  
  /*background-color:#f5f5f5;
  border-radius: 4px;*/

}

.podcast-content {

}

/*============================
  Button
==============================*/

.podcastlist-title {
  font-family: Georgia,'Times new roman',serif;
  font-size:1.5em;
  padding-bottom: 0px;
  line-height: 1.4em;
  padding-left:10px;
  padding-top:10px;
  color: #00abd6;
  font-size:1.6em;
  
}


.podcastlist-title a {
  text-decoration: none;
}

.podcastlist-authors {
  padding:20px 0px 10px 10px;
  
  color:#000;
}
  /*============================
  Button
  ==============================*/



[type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled), button:not(:disabled) {
    cursor: pointer;
  }

  .btn-primary {
    color: #fff;
    background-color: #3b6b80;
    border-color: #3b6b80;
  }

  .btn-primary > a {
    color: #fff;
    
  }

  /*
  .btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: #304f5c;
    border: 1px solid transparent;
      border-top-color: transparent;
      border-right-color: transparent;
      border-bottom-color: transparent;
      border-left-color: transparent;
    padding: .8rem 1.2rem;
    font-size: 1rem;
    border-radius: .4rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }

  .btn:hover {
    background-color: #41768d;
    border-color: #41768d;
  }
*/
  
.podcast-button {
    margin: .25rem .125rem;
    font-family: 'Lato', sans-serif;
    color:#fff;
    font-size: 14px;

}

#podcast-button a {
    color:#fff;
}

.podcast-cover {
  border-radius: .4rem;
}


/*================================
Masque image
==================================*/
.classtransinner {
  position: relative; 
  display: block;
}

img.podimage1 {
  top:0;
  opacity: 1;   
  position: absolute;
  z-index:10;
}

img.podimage2 {
  top:0;
  opacity: 0;  
  position: absolute; 
  z-index:20;
}

.hover-image {
   
  top: 0;
  
  
  opacity: 1;  
  position: absolute; 
  z-index:5;
  height:360px;
  width:390px;

  background-color: #304f5c; /* Couleur par défaut */
  border: 1 px solid;
  color: white;
  padding: 30px;
  font-size: 1.1em;
  
  /* Centrer le contenu */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
  
.classtransinner:hover img.podimage1 {
    opacity: 0;
    transition: opacity .5s ease-in;
    -moz-transition: opacity .5s ease-in;
    -webkit-transition: opacity .5s ease-in;
    -o-transition: opacity .5s ease-in;
    cursor:pointer; 
}

.classtransinner:hover img.podimage2 {
 /*
  opacity: 1;
  transition: opacity 1s ease-out;
  -moz-transition: opacity 1s ease-out;
  -webkit-transition: opacity 1s ease-out;
  -o-transition: opacity 1s ease-out;
  cursor:pointer;  
  */
}

.classtransinner:hover .hover-image {
  /* Positionnement du contenu hover */

 
  cursor:pointer; 
  
  
  /* Effets de transition */
  transition: opacity .3s ease-in;
    -moz-transition: opacity .3s ease-in;
    -webkit-transition: opacity .3s ease-in;
    -o-transition: opacity .3s ease-in;
   
  
  /* Style du contenu hover */
  
}


  


 

