html, body {
  margin: 0;
  height: 100%;             /* need for iframe height 100% to work */
}

body {
    font-family: 'Nanum Gothic', sans-serif;
    font-size: 12px;
    text-align: justify;
    color: #000;
  }
  
  @font-face {
      font-family: "Dyspepsia";
      src: url("http://arvenmore.org/love/fonts//dyspepsia.ttf") format("truetype");
      font-style: normal;
  font-weight: lighter;
  }
  

#fond {    width: 500px;  }

a {
color: #000;
text-decoration: none;
font-family: Tahoma; 
  }
  
  .titreCont {
    text-align: center;
    font-size: 20px;
    color: #cf8e0a;
    margin-bottom: 7px;
    font-weight: bold;
  }
  
  .TexteCont {
    padding: 20px;
  }

  #explication {
    padding: 20px;
  }
  
  .explication {
    padding: 20px;
  }
  
  summary::-webkit-details-marker {
    color: #fff;
  }
  
  details {
    cursor: pointer;
   
    margin-top: 15px;
    border-radius: 10px;
  }
  
  summary {
    font-size: 15px;
    padding: 5px;
    color: #fff;
background-color:#000; 
  }
  
  .truc {
    padding: 10px;
background-color:#000; 
  }

  .evolution {
      text-align: center;
      font-weight: bold;
      margin-top: 5px;
      margin-bottom: 5px;
      font-size: 17px;
  }
  .TexteCont a {
      color: #cf8e0a;
      font-weight: bold;
  }
  .TexteCont img {
      max-width: 340px;
  }

  .resultTxt {
    font-family: Tahoma, Verdana, serif;
  }
  .resultStrong {
    font-weight: bold;
    color: #cf8e0a;
  }

  .resultEm {
    font-size: 13px;
    font-weight: bold;
  }

  .separationResult {
    width: 100%;
    height: 50px;
  }